JQ跑马灯特效,图片横向滚动,自动向左滚动,鼠标切换滚动

基于jQuery的简单跑马灯特效，图片可以自动横向向左滚动，也支持鼠标点击切换向左滚动或者向右滚动，也可以自定义滚动方向，特效插件代码精简，兼容性好，支持IE7以上浏览器。
使用方法：
1、引入JQ库类：

<script src="js/jquery.js"></script>

2、HTML部分主要代码：

其他代码省略……
<div class="img-scroll">
    <span class="prev">〈</span>
    <span class="next">〉</span>
    <div class="img-list">
        <ul>
            <li>
                <a href="https://www.qvdv.net" target="_blank">
                    <img src="images/img2.jpg" title="" alt="简单的跑马灯特效">
                </a>
            </li>
            <li>
                <a href="#" target="_blank">
                    <img src="images/img2.jpg">
                </a>
            </li>
            <li>
                <a href="#" target="_blank">
                    <img src="images/img2.jpg">
                </a>
            </li>
            <li>
                <a href="#" target="_blank">
                    <img src="images/img2.jpg">
                </a>
            </li>
            <li>
                <a href="#">
                    <img src="images/img2.jpg">
                </a>
            </li>
            <li>
                <a href="#" target="_blank">
                    <img src="images/img2.jpg">
                </a>
            </li>
        </ul>
    </div>
</div>
其他代码省略……

3、JS部分代码：

<script>
    function DY_scroll(wraper,prev,next,img,speed,or){    
        var wraper = $(wraper);
        var prev = $(prev);
        var next = $(next);
        var img = $(img).find('ul');
        var w = img.find('li').outerWidth(true);
        var s = speed;
        next.click(function()
        {
            img.animate({'margin-left':-w},function()
            {
                img.find('li').eq(0).appendTo(img);
                img.css({'margin-left':0});
                });
            });
        prev.click(function()
        {
            img.find('li:last').prependTo(img);
            img.css({'margin-left':-w});
            img.animate({'margin-left':0});
            });
        if (or == true)
        {
            ad = setInterval(function() { next.click();},s*1000);
            wraper.hover(function(){clearInterval(ad);},function(){ad = setInterval(function() { next.click();},s*1000);});
        }
    }
    DY_scroll('.img-scroll','.prev','.next','.img-list',1,true);//true为自动播放，去掉或设置为false后，需要手动单击后滚动
</script>

查看演示：https://www.qvdv.net/demo/93355063467/demo.html