Thread: Return Variable

  1. #1
    Dieterg's Avatar
    Registered
    08/01/05
    Location
    Turnhout
    Posts
    1,182
    iTrader
    0
    Mentioned
    0 Post(s)
    Reputation
    9/9

    Return Variable

    Oké, Ik ben wat aan het prutsen om een bannerRotator te maken.

    Het lukt allemaal goed en wel tot ik de next_btn wil coden.
    Die werkt wel, maar ik zou willen dat men timer dan eventjes stopt..? Dus niet als ik klik dat na 1sec. terug de function van de bannerRotator wordt aangeroepen..?

    Code:
    		
    $(function() {
       	var oNxtClick = $('#next_btn .next');
    			var oPrevClick = $('#next_btn .prev');
    			interv == ""
    		        if(interv == ""){
    				timer_start();
    			}else{
    				setInterval('simter_stop()', 3000);	
    			}
    			function timer_start(){
    				setInterval('rotateImages()',1500);
    			}
    			function timer_stop(){
    				interv = ""
    			}
    			oNxtClick.click(function(){		 
    				interv = "1"
    			});
    			oPrevClick.click(function(){
    								  
    			});
            });
    		function rotateImages(){
                var oCurPhoto = $('#bannerRotator div.current');
                var oNxtPhoto = oCurPhoto.next();
    			
                if (oNxtPhoto.length == 0)
                    oNxtPhoto = $('#bannerRotator div:first');
    
                oCurPhoto.removeClass('current').addClass('previous');
                oNxtPhoto.css({ opacity: 0.0 }).addClass('current').stop().animate({ opacity: 1.0 }, 1000,
                    function() {
                        oCurPhoto.removeClass('previous');
                    });
    		}
    Dit is men code tot nu toe. Wat ik dus eigenlijk wil weten is hoe ik die 'interv' naar 1 verander.

    Ik heb ook al 'return interv' geprobeerd in de oNxtClick functie maar dit werkte ook niet? Hoe moet ik er dus voor zorgen dat interv ook in de outerfunctie veranderd? En niet alleen in de inner?

    MVG, Mam
    -
    no votes  

  2. #2
    Drone's Avatar
    Registered
    28/05/03
    Location
    bmb
    Posts
    744
    iTrader
    0
    Mentioned
    0 Post(s)
    Reputation
    15/15
    Je moet je interval in een variable steken zodat je ClearInterval kan doen.

    Ik weet niet of je al veel ervaring hebt met Javascript? De reden waarom ik het vraag is dat je met zoiets nogal veel gaat liggen prutsen, vooral met function/var scopes ga je problemen krijgen.

    Code:
    interv == ""
    Wat wil je met die code bereiken? "==" operator is om dingen te vergelijken. Ik neem aan dat je interv wil initialiseren als een lege string? Hier heb je geluk omdat javascript interv niet kent ga hij deze zelf aanmaken als undefined. Je hebt ook niet het "var" keyword gebruikt dus javascript maakt deze variable gobal wat meestal wordt afgeraden.
    no votes  

  3. #3
    Dieterg's Avatar
    Registered
    08/01/05
    Location
    Turnhout
    Posts
    1,182
    iTrader
    0
    Mentioned
    0 Post(s)
    Reputation
    9/9
    Ik heb er nu een variable van gemaakt.

    Code:
    			var oPrevClick = $('#next_btn .prev');
    			var interv = "";
    		        if(interv == ""){
    				setInterval('rotateImages()',1500);
    			}else{
    				clearInterval(interv);
    			}
    			oNxtClick.click(function(){		 
    				interv = "1"
    			});
    Werkt nog steeds niet?

    Volgens mij is dit omdat 'interv' geen interval is.
    Heb ook al geprobeerd om er een interval van te maken in een variable. Maar ik weet niet hoe ik deze dan moet aanroepen in de functie.

    Code:
    var interv = setInterval('rotateImages',3000)
    intervalStart();
    function intervalStart(){
        interv.start(); // dit weet ik dus niet..
    }
    Ben geen ervaren javascript gebruiker

    edit: die clearInterval werkt, maar als ik nu een functie aanmaak om hem terug te laten starten start hij niet van 0 maar van waar hij gebleven is? :S

    edit2:

    Code:
    $(function() {
       	var oNxtClick = $('#next_btn .next');
    			var oPrevClick = $('#next_btn .prev');
    			var interv = setInterval('rotateImages()',4000);
    			
    			timer_stop();
    			function timer_start(){
    				interv;
    			}
    			
    			function timer_stop(){
    				window.setTimeout('timer_start()',4000);
    
    			}
    			
    			oNxtClick.click(function(){		
    				rotateImages();
    				timer_stop();
    				clearInterval(interv);
    			});
    			oPrevClick.click(function(){
    								  
    			});
            });
    als ik nu op men next button click (oNxtClick.click functie) danroep ik timer_stop aan in deze functie dacht ik te werken met setTimeout, nu heb roep ik de functie timer_start aan maar deze wil niet werken aangezien hij de functie niet vind..?

    timer_start is not defined
    [Break on this error] window.setTimeout('timer_start()',4000); krijg ik in firebug?
    Last edited by Dieterg; 30-03-2010 at 23:00.
    -
    no votes  

  4. #4
    Drone's Avatar
    Registered
    28/05/03
    Location
    bmb
    Posts
    744
    iTrader
    0
    Mentioned
    0 Post(s)
    Reputation
    15/15
    Wat is juist de bedoeling misschien kan ik een voorbeeldje tonen? Gewoon foto's die veranderen met next en previous knoppen?
    no votes  

  5. #5
    Dieterg's Avatar
    Registered
    08/01/05
    Location
    Turnhout
    Posts
    1,182
    iTrader
    0
    Mentioned
    0 Post(s)
    Reputation
    9/9
    jep dat is de bedoeling drone :-).

    Een voorbeeld kan zeer handig zijn! Bedankt!

    Toch wil ik ook graag weten hoe het komt dat firebug zegt dat hem die functie niet kan vinden? Aangezien ik hier ook uit kan leren dan!

    edit: alleen de previous knop nog pfff

    Code:
    $(function() {
       			var oNxtClick = $('#next_btn .next');
    			var oPrevClick = $('#next_btn .prev');
    			var interv = setInterval('rotateImages()',5000);
    			
    			timer_start();
    			function timer_start(){
    				interv;
    			}
    			
    			function timer_stop(){
    				setTimeout(function(){interv = setInterval('rotateImages()',5000)})
    			}
    			
    			oNxtClick.click(function(){		
    				rotateImages();
    				timer_stop();
    				clearInterval(interv);
    			});
    			oPrevClick.click(function(){
    				clearInterval(interv);
    				timer_stop();
    				var oCurPhoto = $('#bannerRotator div.current');
    				var oPrevPhoto = oCurPhoto.prev();
    				
    				if(oPrevPhoto.length == 0){
    					oPrevPhoto = $('#bannerRotator div:last');
    				}
    				
    				oPrevPhoto.css({ opacity: 0.0 }).addClass('current').removeClass('previous').stop().animate({ opacity: 1.0 }, 1000);
    				oCurPhoto.removeClass('current');
    			});
            });
    Hellyeah, het is me gelukt na 2uurs! Drone, als je nog een betere oplossing hebt? Want ik kan begrijpen dat deze code nogal heel nobish overkomt. Maarja, ik ben er geraakt!
    Last edited by Dieterg; 30-03-2010 at 23:43.
    -
    no votes  

  6. #6
    Drone's Avatar
    Registered
    28/05/03
    Location
    bmb
    Posts
    744
    iTrader
    0
    Mentioned
    0 Post(s)
    Reputation
    15/15
    Ik denk dat het is omdat setTimeout op window staat maar ik ben hier niet 100% zeker van. Ik heb ook vaak problemen met function scopes in javascript omdat het niet altijd evident is.

    JS Bin - Collaborative JavaScript Debugging

    Het is nog niet helemaal af maar het is wel in de richting van hoe je het zou kunnen oplossen. Ik moet er nog een teller in verwerken zodat het verschillende foto's kan doorlopen.

    Het grote verschil met jou code is dat het geen gebruik maakt van setInterval maar gewoon de animaties achter elkaar gaat uitvoeren. Ik heb ook gezien dat Jquery 1.4 een delay functie heeft dus dan kan ik ook setTimeout weglaten. Maar dat zal iets voor morgen zijn.
    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