jquery水平幻灯片像字幕

时间:2012-06-25 16:51:54

标签: jquery marquee

JQUERY

        $(document).ready(function(){
            var wi = 0;
            window.setInterval(function() {
                wi += 15;
             $(".students-holder").animate({"position": "relative","left": wi});
            }, 1);
        })

CSS

.students{
background: #262525;
width: 860px;
height: 54px;
padding: 0 5px;
position:relative;
overflow:hidden;}

.students-holder{
min-width:2000px;
position:absolute;
left:-50px;}

.inline-image{
display:inline-block;}

HTML

<div class="students">
<div class="students-holder">
    <img class="inline-image" src="https://graph.facebook.com/mardhagz/picture"/>
    <img class="inline-image" src="https://graph.facebook.com/mardhagz/picture"/>
    <img class="inline-image" src="https://graph.facebook.com/mardhagz/picture"/>
    <img class="inline-image" src="https://graph.facebook.com/mardhagz/picture"/>
</div></div>

DEMO LINK http://jsfiddle.net/2vCNR/

那里:/有人知道像左边的方向吗?如果mouseover将停止(); mouseout run(); :/请帮忙......

1 个答案:

答案 0 :(得分:0)

使用此JQuery:

    $(document).ready(function(){
        var wi = 0;
        window.setInterval(function() {
            wi -= 5;
         $(".students-holder").animate({"position": "relative","left": wi});
        }, 1);
    })