正直に言うと、このスライダーはどこかからダウンロードして入手したもので、Javascript に関する知識はほとんどありません。
4 秒または 5 秒ごとに次の画像またはコンテンツに自動的に移動するようにスライダーを取得しようとしていますが、マウスがコンテンツの上に置かれたときにスライダーを停止させたいと考えています。
ここに私のコードがあります
$(document).ready(function(){
if(jQuery("#slider").length){
var totalImages = jQuery("#slider > li").length,
imageWidth = jQuery("#slider > li:first").outerWidth(true),
totalWidth = imageWidth * totalImages,
visibleImages = Math.round(jQuery("#slider-wrap").width() / imageWidth),
visibleWidth = visibleImages * imageWidth,
stopPosition = (visibleWidth - totalWidth);
jQuery("#slider").width(totalWidth);
jQuery("#gallery-prev").click(function(){
if(jQuery("#slider").position().left < 0 && !jQuery("#slider").is(":animated")){
jQuery("#slider").animate({left : "+=" + imageWidth + "px"});
}
return false;
});
jQuery("#gallery-next").click(function(){
if(jQuery("#slider").position().left > stopPosition && !jQuery("#slider").is(":animated")){
jQuery("#slider").animate({left : "-=" + imageWidth + "px"});
}
return false;
});
}
});