Archief - Return Variable

Het archief is een bevroren moment uit een vorige versie van dit forum, met andere regels en andere bazen. Deze posts weerspiegelen op geen enkele manier onze huidige ideeën, waarden of wereldbeelden en zijn op sommige plaatsen gecensureerd wegens ontoelaatbaar. Veel zijn in een andere tijdsgeest gemaakt, al dan niet ironisch - zoals in het ironische subforum Off-Topic - en zouden op dit moment niet meer gepost (mogen) worden. Toch bieden we dit archief nog graag aan als informatiedatabank en naslagwerk. Lees er hier meer over of start een gesprek met anderen.
D

Dieterg

Legacy Member
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
D

Drone

Legacy Member
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.
D

Dieterg

Legacy Member
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?
D

Drone

Legacy Member
Wat is juist de bedoeling misschien kan ik een voorbeeldje tonen? Gewoon foto's die veranderen met next en previous knoppen?
D

Dieterg

Legacy Member
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 :D

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! :D
D

Drone

Legacy Member
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. :D
Het archief is een bevroren moment uit een vorige versie van dit forum, met andere regels en andere bazen. Deze posts weerspiegelen op geen enkele manier onze huidige ideeën, waarden of wereldbeelden en zijn op sommige plaatsen gecensureerd wegens ontoelaatbaar. Veel zijn in een andere tijdsgeest gemaakt, al dan niet ironisch - zoals in het ironische subforum Off-Topic - en zouden op dit moment niet meer gepost (mogen) worden. Toch bieden we dit archief nog graag aan als informatiedatabank en naslagwerk. Lees er hier meer over of start een gesprek met anderen.
Terug
Bovenaan