问News Ticker循环
EN

Stack Overflow用户

提问于 2014-09-14 19:37:44

回答 1查看 342关注 0票数 0

我想循环这段代码，因为这是新闻报价器，我想运行repeatdly.kindly帮助我。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org /TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>News Ticker</title>
<script type="text/javascript" src="jquery-2.1.1.js"></script>
</head>
<body style="margin:0px">
<div style="background-color: #CCCCCC; width: 100%; height: 40px">
<span id="ticker" style="left: 120%; position: absolute; overflow: hidden; top:10px;   width: 30%">This is a text</span>
</div>

<script type="text/javascript">

        $("#ticker").animate({ "left": "-420px" }, 1000, 'linear', ticker);

</script> 

</body>
</html>

jquery

回答 1

Stack Overflow用户

发布于 2014-09-14 19:47:39

你就快到了。这里只有几个问题需要解决：

你需要把你的动画方法放在一个函数里面，这样它才能再次被调用。然后，您首先需要调用该函数。
您需要重置<span>的left属性，以便它不会每次都继续向左移动。
您(可能)需要将position:relative和overflow:hidden赋给父级，以便相对于其父级定位D11，并在它不在父级边界内时将其隐藏:H212

HTML

<div style="background-color: #CCCCCC; width: 100%; height: 40px; overflow:hidden; position:relative;">
    <span id="ticker" style="left: 120%; position: absolute; overflow: hidden; top:10px;   width: 30%">This is a text</span>
</div>

JavaScript

var ticker = function(){
    $("#ticker").css({left:"120%"}).animate({ "left": "-420px" }, 1000, 'linear', ticker);
}

ticker();

票数 0

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/25832801

复制

相似问题

问News Ticker循环
EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问News Ticker循环EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问News Ticker循环
EN