我对用于幻灯片放映的以下脚本有疑问。目前它是静态的,我的目标是包含 setInterval 以便幻灯片旋转。任何人都可以在这里建议如何更好地实现此方法,因为我找不到设置 setInterval 的合适位置。
这是代码:
<script type="text/javascript">
$(document).ready(function() {
var theImage = $('ul.photos li img');
var theWidth = theImage.width()
//wrap into mother div
$('ul.photos').wrap('<div id="mother" />');
//assign height width and overflow hidden to mother
$('#mother').css({
width: function() {
return theWidth;
},
height: function() {
return theImage.height();
},
position: 'relative',
overflow: 'hidden'
});
//get total of image sizes and set as width for ul
var totalWidth = theImage.length * theWidth;
$('ul.photos').css({
width: function(){
return totalWidth;
}
});
$(theImage).each(
function(intIndex){
$(this).nextAll('a')
.bind("click", function(){
if($(this).is(".next")) {
$(this).parent('li').parent('ul').animate({
"margin-left": (-(intIndex + 1) * theWidth)
}, 1000)
} else if($(this).is(".previous")){
$(this).parent('li').parent('ul').animate({
"margin-left": (-(intIndex - 1) * theWidth)
}, 1000)
} else if($(this).is(".startover")){
$(this).parent('li').parent('ul').animate({
"margin-left": (0)
}, 1000)
}
});//close .bind()
});//close .each()
});
</script>
我将非常感谢任何答案。