Heim >Web-Frontend >js-Tutorial >So legen Sie fest, dass Text in JQuery kontinuierlich gescrollt wird
So legen Sie fest, dass Text in JQuery kontinuierlich gescrollt wird
- coldplay.xixiOriginal
- 2020-11-17 15:33:172011Durchsuche
So richten Sie ununterbrochenes Scrollen von Text in JQuery ein: 1. Einzeiliges Scrollen, der Code lautet [$(this).css({marginTop:"0px"}).find("li:first").appendTo ()]; 2, Mehrzeiliges Scrollen, der Code lautet [Scroll:function()].
So richten Sie ununterbrochenes Scrollen von Text in jquery ein:
1. Einzeiliges Scrollen
rrree3. Steuerbares Vorwärts- und Rückwärtsscrollen
<!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>
<meta http-equiv="Content-Type" c />
<title>无标题文档</title>
<style type="text/css">
ul,li{margin:0;padding:0}
#scrollDiv{width:300px;height:25px;line-height:25px;border:#ccc 1px solid;overflow:hidden}
#scrollDiv li{height:25px;padding-left:10px;}
</style>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript">
function AutoScroll(obj){
$(obj).find("ul:first").animate({
marginTop:"-25px"
},500,function(){
$(this).css({marginTop:"0px"}).find("li:first").appendTo(this);
});
}
$(document).ready(function(){
setInterval('AutoScroll("#scrollDiv")',1000)
});
</script>
</head>
<body>
<div id="scrollDiv">
<ul>
<li>这是公告标题的第一行</li>
<li>这是公告标题的第二行</li>
<li>这是公告标题的第三行</li>
<li>这是公告标题的第四行</li>
<li>这是公告标题的第五行</li>
<li>这是公告标题的第六行</li>
<li>这是公告标题的第七行</li>
<li>这是公告标题的第八行</li>
</ul>
</div>
</body>
</html> Verwandte kostenlose Lernempfehlungen: JavaScript
Das obige ist der detaillierte Inhalt vonSo legen Sie fest, dass Text in JQuery kontinuierlich gescrollt wird. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!
Stellungnahme：
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Vorheriger Artikel：So geben Sie HTML-Code mit JQuery ausNächster Artikel：So geben Sie HTML-Code mit JQuery aus