在网页上循环移动文本
我正在设计网页,我需要将文本从监视器屏幕的左侧移动到屏幕的右侧。 我尝试过使用<marquee>
标记。 它工作没有任何错误。
我的要求是当文本即将消失在网页的右侧时,它应该从页面的左侧开始出现。 它不应该等待所有文本消失,然后从左侧开始。
直到现在,我一直只使用<html>
来完成它。 请建议其他方式。
有可能使用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)
})()
这样,一旦文字开始消失在右侧,文字就会开始出现在右侧。 修改相对宽度以实现不同的效果。
链接地址: http://www.djcxy.com/p/11385.html