1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39
| <div id="slideshow" class="slideshow-fixe">
<div class="nav">
<div class="thumb"><img src="imagesFront/images/img1.jpg" alt=""/></div>
<div class="thumb"><img src="imagesFront/images/img2.jpg" alt=""/></div>
<div class="thumb"><img src="imagesFront/images/img3.jpg" alt=""/></div>
<div class="thumb"><img src="imagesFront/images/img4.jpg" alt=""/></div>
</div>
<div class="img-large">
<img src="imagesFront/images/img1.jpg" alt=""/>
</div>
</div>
<script type="text/javascript">
jQuery(function(){
// Slideshow Caroufredsel
$("#slideshow-widget ul").carouFredSel({
auto : false,
circular: false,
prev : "#prev",
next : "#next"
});
});
</script>
// Code du plugin
(function($){
jQuery.fn.slideshowHover = function(options){
var thumb = options.divThumb;
var zoom = options.divZoom;
$(thumb +" img").css("cursor","pointer");
$(thumb + " img").click(function(){
$(zoom + " img").hide();
var src = $(this).attr("src");
$(zoom + " img").fadeIn().attr("src",src);
})
}
})(jQuery) |
Partager