简单jQuery图像旋转器
Posted
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了简单jQuery图像旋转器相关的知识,希望对你有一定的参考价值。
var count = 0, holder = '#rotatorSlides', sclass = '.rslide', inc = 4000; function rotate() { count++; // Create loop setTimeout(function() { rotate(); }, inc); // If this is the first iteration if (count == 1) { var first = $(sclass)[0]; var firstc = $(first).clone().appendTo(holder).siblings().hide(); $(first).remove(); return; } // Rotate Images var img = $(sclass)[0]; var clone = $(img).clone().appendTo(holder).fadeIn(800, function() { $(this).siblings().hide(); }); $(img).remove(); } // Usage Example // // CSS RULES // #rotatorSlides { // width: 589px; // height: 114px; // position: relative; // } // img.rslide { // position: absolute; // top: 0px; // left: 0px; // } // // html MARKUP // <div id="rotatorSlides"> // <img src="images/rslide-1.jpg" width="589" height="114" alt="" class="rslide"> // <img src="images/rslide-2.jpg" width="589" height="114" alt="" class="rslide"> // <img src="images/rslide-3.jpg" width="589" height="114" alt="" class="rslide"> // <img src="images/rslide-4.jpg" width="589" height="114" alt="" class="rslide"> // </div>
以上是关于简单jQuery图像旋转器的主要内容,如果未能解决你的问题,请参考以下文章