Beste leden,

Met behulp van wat tutorials heb ik een fadeslide gemaakt.
De slider stopt bij de tweede foto, kan iemand mij helpen wat er nu verkeerd gaat?

Link JSFiddle

Gr. Jop
Ik zie het niet helemaal, maar "show" is maar 1 (het actieve) element? Dus weet niet of show.count() nu zoveel hout snijdt?

Daarnaast weet ik niet of .addClass('active').removeClass('active'); een netto effect heeft :).

Ik zou eens kijken welke elementen je nu precies selecteert, dat verschaft wss wel enig inzicht.

Ontdoe de slider in eerste instantie ook van alle effecten, dat is alleen maar "clutter" bij het opzetten van de algehele structuur.
@Thomas
QUOTE
Daarnaast weet ik niet of .addClass('active').removeClass('active'); een netto effect heeft :).


Je zat er niet ver naast.

@Jop

De fout zit hem dat je eerst een class 'active' plaatst en daarna hem gelijk weer verwijdert, dus je moet even deze regel veranderen:

next.fadeIn(fadetime).addClass('active').removeClass('active');

Naar:

next.fadeIn(fadetime).addClass('active');


Edit: Kleine tip: () is niet nodig in dit geval, dus:


var fadetime = (8000);

wordt zo:

var fadetime = 8000;
Beste Thomas en Davy,



Dank voor het meedenken. Vanmorgen heb ik een andere code gemaakt


function paraslide(){
	var $active = $('#slider img.active');
	if($active.length == 0) $active = $('#slider img:last');
	
	var $next = $active.next().length ? $active.next():$('#slider img:first');

	$active.addClass('last-active');

	$next.css({opacity: 0.0}).addClass('active').animate({opacity:1.0}, 2000, function(){
	$active.removeClass('active last-active');
})
}

$(document).ready(function(){
	var timer = 4000;
	setInterval("paraslide()", timer);
	
$('#slider').hover(function(){
	clearInterval("paraslide()", timer);
});	



$('#slider').hover(function(){
	$('#prev, #next').stop().fadeIn(1000)}, function(){
	$('#prev, #next').stop().fadeOut(1000)});
});


Nu zou ik nog twee dingen willen, stop inteval als er een hover plaats vind en als er op de buttons word geklikt dat er een functie aan hangt slide terug en slide vooruit.

Het eerste heb ik zelf al geprobeerd, maar werkt niet.
Kunnen jullie mij opweg helpen hiermee?

Alvast dank.

Gr. Jop
Voeg even je html en css bij svp, dat maakt het er makkelijker op.
Best Davy,


Dank voor de reactie. Hierbij zend ik een nieuwe fiddle met een nieuwe code.
Het stoppen van de slider d.m.v. een hover is gelukt!
wat ik niet voor elkaar krijg is om de buttons vorige slide en volgende slide te coderen in jquery. Hier zou ik graag een zetje in de rug bij willen hebben.

de Fiddle


gr. Jop

Reageren