7

我正在设计网页，我需要将文本从显示器屏幕左侧移动到屏幕右侧。我试过用<marquee>标签。它工作正常，没有任何错误。

我的要求是每当文本即将在网页右侧消失时，它应该从页面左侧开始出现。它不应该等待所有文本消失然后从左侧开始。

直到现在我一直在使用它<html>。也请建议其他方式。

4

1 回答 1

3

可以使用 Javascript：

将滚动的文本的两个副本分开容器的宽度。从（左侧副本可见）动画到（右侧副本可见），然后跳回并重复。

类似于（未经测试，使用 jQuery）：

<div class="outer">
  <div class="inner">
     some text
  </div>
</div>

CSS：

.outer, .inner {
  width: 100%;
}
.outer {
  position: relative;
  overflow: hidden;
}
.inner {
  position: absolute;
}

js：

(function rerun(){
  var time = 10000 //ms

  $(".inner").slice(0,-1).remove()
  $i1=$(".inner")
  $i2=$i1.clone()

  $i1.css({left:0}).animate({left:"-100%"}, time)
  $i2.insertAfter($i1).css({left:"100%"}).animate({left:0}, time, rerun)
})()

这样，一旦文本开始在右侧消失，文本就应该开始出现在右侧。修改相对宽度以获得不同的效果。

于 2012-10-30T15:36:13.690 回答