javascript - 使用 jquery 滚动太长的文本

Question

我正在尝试创建一个在线音乐播放器/中心。

我有一个播放音乐并显示当前轨道的播放器:

从歌曲的标题可以看出，对于 div 来说太长了。我想做的是滚动文本并将其重置为重新滚动等。

我尝试使用以下代码:

html:

<div id="top-bar">
<div id="player-container">
        <div id="player">
          <div id="level1">
            <div class="current-track"><h1><span id="title">Party All Night (Sleep All Day) -</span> Sean Kingston</h1></div>
            <div class="add-to-playlist"></div>
            <div class="share"></div>
          </div>
          <div class="clearfix"></div>
          <div id="level2">
            <div class="current-time">0:00</div>
            <div class="progress"><span id="slider"></span></div>
            <div class="total-time">3:43</div>
          </div>
        </div>
  </div>
</div>

J查询:

$(function() {
    var scroll_text;
    $('div.current-track').hover(

    function() {
        var $elmt = $(this);
        scroll_text = setInterval(function() {
            scrollText($elmt);
        }, 5);
    }, function() {
        clearInterval(scroll_text);
        $(this).find('div.current-track h1').css({
            left: 0
        });
    });

    var scrollText = function($elmt) {
        var left = $elmt.find('div.current-track h1').position().left - 1;
        left = -left > $elmt.find('div.current-track h1').width() ? $elmt.find('div.current-track').width() : left;
        $elmt.find('div.current-track h1').css({
            left: left
        });
    };

});​​

任何指针都会被应用

这是给你们的 jsfiddle:JSfiddle

更新

谁能告诉我:

1. 如何让它自动发生？ 完成
2. 如何减慢滚动速度？ 完成

这是为你们更新的 jsfiddle:JSfiddle

Answer 1

我认为你误解了如何jquery .find()作品:

$elmt.find('div.current-track h1')

应该是:

$elmt.find('h1')

http://jsfiddle.net/Dn6jx/5/

编辑:更新 fiddle 以供评论

http://jsfiddle.net/Dn6jx/15/