1. #1
    kaketoe's Avatar
    Registered
    04/08/09
    Location
    Merelbeke, Gent, Belgium
    Posts
    263
    iTrader
    0
    Mentioned
    0 Post(s)
    Reputation
    0/1

    Aanroepen van functies met setTimeout()

    Hallo!
    Ik zit met een vreemd probleem... Ik ben geen leek op het vlak van programmeren, maar javascript heb ik nooit echt veel tijd ingestoken en daar is nu verandering in gekomen.

    Ik probeer het volgende te doen:
    Ik heb een reeks <span id="colx"><ul><li>...</li></ul><span (enz...)
    En zo heb ik een 10-tal spans.

    Nu wil ik ze één voor één een seconde laten zien, dan hiden en dan de volgende (met de volgende index) laten zien. Totdat we bij de laatste komen en dan beginnen we opnieuw.

    Nu loopt firefox vast op dit script: (ik had het eerst geprobeerd met recursie, maar dat bleek ook niet te werken)

    Met behulp van JQuery:
    Code:
            <script type="text/javascript">
                var i = 1;
                $(function callme(){
                    while (true) {
                        $("#col" + i).toggle();
                        setTimeout("$(\"#col\"+i).hide()", 1000);
                        i++;
                        i %= 11;
                    }
                });
            </script>
    Ik vermoed dat de thread ergens vastloopt, maar er moet toch een mogelijkheid zijn om een nieuwe thread op te starten die zo zijn werk kan doen? Als dat al niet automatisch gebeurd.

    U ziet het, ik weet er echt bitterweinig van...

    Enlighten me!

    Groetjes,
    kaketoe
    .
    no votes  

  2. #2
    Drone's Avatar
    Registered
    28/05/03
    Location
    bmb
    Posts
    744
    iTrader
    0
    Mentioned
    0 Post(s)
    Reputation
    15/15
    Als de code al zou werken zouden alle elementen aan en uit gaan op het zelfde moment. De setTimeout gaat de coden niet stoppen maar wordt asynchroon uitgevoerd. Ik weet wel niet direct een antwoord op je vraag. Ik ben een programmeer leek die al veel tijd heeft gestoken in Javascript.

    Wat doet de %= operator btw?
    no votes  

  3. #3
    Zero Grav's Avatar
    Registered
    06/06/04
    Location
    Bilzen
    Posts
    8,805
    iTrader
    18 (100%)
    Mentioned
    0 Post(s)
    Reputation
    42/128
    Ik zou het wel kunnen oplossen in JQuery, niet in gewoon Javascript. Maar dan wel pas morgen.
    no votes  

  4. #4
    Drone's Avatar
    Registered
    28/05/03
    Location
    bmb
    Posts
    744
    iTrader
    0
    Mentioned
    0 Post(s)
    Reputation
    15/15
    Quitter!

    Hij gebruikt Jquery in zijn voorbeeld btw.
    no votes  

  5. #5
    Zero Grav's Avatar
    Registered
    06/06/04
    Location
    Bilzen
    Posts
    8,805
    iTrader
    18 (100%)
    Mentioned
    0 Post(s)
    Reputation
    42/128
    Ja, nu ge het zegt, 'k had niet verder gekeken dan de outlines van die functie eigenlijk. Ik speurde dus naar een each() om te kijken of het een JQuery loop was. ^^

    Kunt ge eens een omsluitende div ofzo tonen? Dat ik de id/class daarvan kan gebruiken om de loop uit te voeren.

    Ahja, maar gij wilt een soort slideshowke tonen? Dan moet ge hier eens een paar threads verder kijken. 't Is net nog maar één voorbijgekomen.
    no votes  

  6. #6
    Drone's Avatar
    Registered
    28/05/03
    Location
    bmb
    Posts
    744
    iTrader
    0
    Mentioned
    0 Post(s)
    Reputation
    15/15
    In Jquery 1.4 is er blijkbaar een delay functie: .delay() – jQuery API. Gevonden via delay JQuery effects - Stack Overflow
    no votes  

  7. #7
    kaketoe's Avatar
    Registered
    04/08/09
    Location
    Merelbeke, Gent, Belgium
    Posts
    263
    iTrader
    0
    Mentioned
    0 Post(s)
    Reputation
    0/1
    Euh, elk element heeft een verschillend id (id="colx") met x een cijfer van 1..10. En daarbij hebben ze nog allemaal een section die "sponsortext" heet.

    (de eigenlijke functie zou een soort van slideshow moeten worden die allemaal sponsors weergeeft, het zijn er 50 dus zocht ik naar een handige manier om die allemaal aan bod te laten komen)

    De %= operator is de modulooperator die de rest na deling door het tweede lid teruggeeft en in het eerste lid steekt.

    Die delay() ga ik eens naar kijken, dat ziet er behoorlijk boeiend uit. Maar dat geeft helaas geen antwoord waarom mijn huidig snippetje niet werkt Imo zit het vrij basic in elkaar...

    Die thread voor die slideshow ga ik ook eens induiken!

    Alleszins reuzebedankt voor de vlotte antwoorden!
    .
    no votes  

  8. #8
    kaketoe's Avatar
    Registered
    04/08/09
    Location
    Merelbeke, Gent, Belgium
    Posts
    263
    iTrader
    0
    Mentioned
    0 Post(s)
    Reputation
    0/1
    Oké, dit heb ik eens geprobeerd maar het werkt nog niet... Hij voert de loop slechts éénmaal uit... JQuery begrijp ik niet zo goed dus kan iemand mij het uitleggen?

    Code:
    			$(function() {
    				$(".sponsortext").each(function(index) {
    					$(this).show("slow");
    					$(this).delay(800).hide("slow");
    				});
    			});
    (sorry voor de slechte indentatie)
    De slideshow thread heb ik helaas niet gevonden...


    Groetjes
    .
    no votes  

  9. #9
    Drone's Avatar
    Registered
    28/05/03
    Location
    bmb
    Posts
    744
    iTrader
    0
    Mentioned
    0 Post(s)
    Reputation
    15/15
    Je kan each vergelijken met een foreach loop. Ik neem aan dat hij alle elementen aan een uit doet op het zelfde moment? Each gaat in dit geval op iedere element show() en dan hide() doen. Net zoals setTimeout gaat delay javascript niet stoppen maar wordt die asynchrone uitgevoerd op het element zelf.

    Je moet het maar eens testen met setTimeout. Je zal eerst "Lies!" zien en dan "First!" omdat setTimeout de code niet tegen stopt maar zijn eigen "weg" gaat. Het is dus niet te vergelijken met zoiets als Thread.sleep() in andere programeertalen.

    Code:
    setTimeout(function(){
        alert("First!")
    }, 5000);
    
    alert("Lies!");
    Ik heb het niet getest maar zoiets zou normaal gezien werken. Ieder element krijgt een verschillende delay wanneer hij show moet doen.

    Code:
    $(".sponsortext").each(function(i)){
        $(this).delay(1000 * i)
                 .show("slow")
                 .delay(800)
                 .hide("slow");
    });
    Javascript is een beetje een rare taal. Er zijn veel mensen die het kunnen gebruiken zoals ik. Maar ik denk dat er niet zoveel zijn die echt heel goed met javascript kunnen werken.

    Hidden Features of JavaScript? - Stack Overflow leuke link met wat javascript voorbeeldjes
    no votes  

  10. #10
    kaketoe's Avatar
    Registered
    04/08/09
    Location
    Merelbeke, Gent, Belgium
    Posts
    263
    iTrader
    0
    Mentioned
    0 Post(s)
    Reputation
    0/1
    Heel vreemd, bij mij doet dat helemaal niets?

    Inderdaad echt absurd dat javascript niet serieel wordt verwerkt... Ik heb nog nooit met zoiets vreemds gewerkt
    Alleszins bedankt voor de grote hulp! Ik snap echter wel niet waarom het niet werkt... Firebug laat het even afweten -_-'

    Internet Explorer zegt dat hij die "methode niet op dat object kan uitvoeren"
    (allez, in Aptana Studio toch, wss de development versie van IE die daarin zit ingebakken)

    I'll keep you posted.
    .
    no votes  

  11. #11
    adrianhates's Avatar
    Registered
    23/01/06
    Posts
    2,115
    iTrader
    0
    Mentioned
    0 Post(s)
    Reputation
    23/23
    Quote Originally Posted by [drone]-[1.05] View Post
    This quote is hidden because you are ignoring this member. Show
    Hidden Features of JavaScript? - Stack Overflow leuke link met wat javascript voorbeeldjes
    Da is wel nen dikke bookmark waard ze amai. Vette link
    no votes  

  12. #12
    kaketoe's Avatar
    Registered
    04/08/09
    Location
    Merelbeke, Gent, Belgium
    Posts
    263
    iTrader
    0
    Mentioned
    0 Post(s)
    Reputation
    0/1
    Wat suf... Ik heb blijkbaar versie 1.3 staan :P

    Ik had nooit gedacht dat er in die korte periode dat jQuery al functionaliteit ging bijkomen die ik ging gebruiken
    Snel eens updaten en dan eens zien wat het geeft.
    .
    no votes  

  13. #13
    woony's Avatar
    Registered
    03/12/03
    Location
    Oostende
    Posts
    2,599
    iTrader
    78 (100%)
    Mentioned
    0 Post(s)
    Reputation
    7/10
    heb thread niet volledig gelezen... Maar heb laatst tutorial gelezen die misschien wat in die trend ligt.
    check het eens.
    Quick Tip: Easy Sequential Animations in jQuery | Nettuts+
    no votes  

  14. #14
    kaketoe's Avatar
    Registered
    04/08/09
    Location
    Merelbeke, Gent, Belgium
    Posts
    263
    iTrader
    0
    Mentioned
    0 Post(s)
    Reputation
    0/1
    Quote Originally Posted by woony View Post
    This quote is hidden because you are ignoring this member. Show
    heb thread niet volledig gelezen... Maar heb laatst tutorial gelezen die misschien wat in die trend ligt.
    check het eens.
    Quick Tip: Easy Sequential Animations in jQuery | Nettuts+
    Mooi! Dat doet mij JS een stukje beter begrijpen...

    Ik ben er helaas echt niet uitgeraakt. Maar ik heb een workaround gevonden mbv Carousel, een JQuery plugin die eigenlijk ongeveer doet wat ik wou...

    Dus deze thread mag dicht, voor de geïnteresseerden, hier nog eens de link:
    jquery-infinite-carousel - Project Hosting on Google Code

    Jullie zijn allemaal reuzehard bedankt, indirect hebben jullie zeker bijgedragen tot de oplossing

    Ik ga hier nog komen ^^

    Groetjes,
    Kaketoe
    .
    no votes  

  15. #15
    Tyfius's Avatar
    Registered
    01/09/02
    Location
    Peutie
    Posts
    7,664
    iTrader
    0
    Mentioned
    4 Post(s)
    Reputation
    13/105
    Ik ben er ook geen expert in maar volgens mij is uw setup fout. Onderstaand voorbeeld werkt bijvoorbeeld wel:
    Code:
    $(document).ready(function() {update();});
    
    function update() { 
      $("#board").append(".");
      setTimeout('update()', 1000);
    }
    Vanaf nu gaan we verder op BeyondGaming!
    In deze thread wordt uitgelegd hoe je jouw account kan migreren.
    no votes  

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  

Log in

Log in