Question

我需要平滑的文本滚动条，比如自动收报机，文本会一个接一个地从左到右平滑滚动，还需要悬停效果来停止动画。我尝试过使用jQuery，但还是没有得到它。

      <ul id="ticker">
          <li>this is first title</li>
          <li>this is second title</li>
          <li>this is third title</li>
          <li>this is fourth title</li>
          <li>this is fifth title</li>
      </ul>

Answer 1

您必须将ul和li元素包装在选取框中，然后执行以下操作：

<marquee behavior="scroll" scrollamount="3" direction="left" 
    onmouseover="this.stop();" onmouseout="this.start();">
       <ul id="ticker">
          this is first title    
          this is second title
          this is third title
          this is fourth title
          this is fifth title
      </ul> 
</marquee>

CSS

marquee {
    text-indent:-100px;
    width:450px;
}

Here是jsfiddle

中的一个工作示例

Answer 2

<ul id="list">

  <li id="1" style="margin-bottom:80px;">aaaaaaaaaaaaaaaaaaaaaaaaaaaa.</li>
  <li id="2" style="margin-bottom:80px;">zzzzzzzzzzzzzzzzzzzzzzzzzzzzzzz.</li>

</ul>

从左到右滚动列表标签内容一个接一个

2 个答案: