Salut à tous !
j'essaie d'adapter ce bout de code jquery ( http://buildinternet.com/2009/03/sli...s-with-jquery/) pour une galerie d'images. Seulement problème je ne peux pas faire ce que je veux avec la structure html du site, je passe par un CMS (contao que je vous conseille au passage).
donc en gros sur le modèle de cette structure simple :
Code html : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8 <div class="boxgrid captionfull"> <img src="jareck.jpg"/> <div class="cover boxcaption"> <h3>Jarek Kubicki</h3> <p>Artist<br/><a href="http://www.nonsensesociety.com/2009/03/art-by-jarek-kubicki/" target="_BLANK">More Work</a></p> </div> </div>
avec cette fonction :
J'essaie de l'adapter à mon architecture qui est la suivante :
Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12 <script type="text/javascript"> $(window).load(function() { //Full Caption Sliding (Hidden to Visible) $('.boxgrid.captionfull').hover(function(){ $(".cover", this).stop().animate({top:'160px'},{queue:false,duration:160}); }, function() { $(".cover", this).stop().animate({top:'260px'},{queue:false,duration:160}); }); }); </script>
Code html : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14 <div class="boxgrid captionfull> <div class="layout_latest block first even"> <div class="image_container"> <img src="tl_files/monsite/images/syndicat_rea.jpg" width="257" height="141" alt="Charte finale" /> </div> <div class="cover boxcaption"> <h2><a href="test.html" title="Lire l'article: Syndicat ">Syndicat</a></h2> <p class="teaser"></p> <p class="more"><a href="index.php" title="Lire l'article">En savoir plus... <span class="invisible">Syndicat </span></a></p> </div> </div>
Je me suis bien débrouillé pour recréer une "div" boxgrid captionfull qui englobe le cover boxcaption mais à mon avis dans la fonction jquery le chemin ne doit pas être bon et j'avoue ne pas être assez calé pour le réécrire correctement.
j'ai essayé plusieurs trucs dontmais rien n'y fait.
Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11 <script type="text/javascript"> $(window).load(function() { //Full Caption Sliding (Hidden to Visible) $('.boxgrid.captionfull.image_container').hover(function(){ $(".cover", this).stop().animate({top:'160px'},{queue:false,duration:160}); }, function() { $(".cover", this).stop().animate({top:'260px'},{queue:false,duration:160}); }); }); </script>
Ce n'est pas un problème d'exécution du jquery car si je le colle tel quel dans ma page cela fonctionne...
si quelqu'un voit le problème je suis tout ouïe
Merci encore !
Partager