Faire un slide d'image tout bête
Bonjour,
Voilà comme dit dans le titre je souhaiterai faire un slide d'image tout bête. J'ai déjà utiliser des pluggins style cycle ou autre qui marche très bien mais hélas m'apporte quelque bug pas agréable sur mon site.
Du coup je veux essayer de le faire à ma manière et de façon toute bête.
J'ai une balise <a></a> et une balise <img />
La seul chose que je souhaite effectuer est la suivante : toute les x seconde, un fadeOut de l'image (ou de la div contenant les balise a et img), je change les attributs actuels de ma balise a et img, et affiche le nouveau.
Voilà mon code :
Code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
| var referenceIndex = 1;
setInterval(function(){
$("#referenceSlider tr td").fadeOut("slow",function(){
$("#referenceLink").attr({"href":tabReference[referenceIndex][1]});
$("#referenceImg").attr({
"src":"/administration/fr/reference/"+tabReference[referenceIndex][2],
"title":tabReference[referenceIndex][0],
"alt":tabReference[referenceIndex][0]
});
});
$("#referenceSlider tr td").fadeIn("slow");
referenceIndex++;
if(referenceIndex+1 > tabReference.length){
referenceIndex = 0;
}
} |
Bon j'ai une histoire de tableau contenant les données mais c'est pas le plus important. Ce qui me dérange, c'est que entre mon fadeIn et mon fadeOut l'image n'a pas toujours le temps de changer ce qui fait que parfois l'image se cache, elle se réaffiche et au moment de la réapparition, elle change.
Comment faire pour que justement mon image se cache, les attributs changent et à la réapparition ce soit toujours une nouvelle qui apparaisse ?
Merci d'avance.
