码迷,mamicode.com
首页 > 编程语言 > 详细

javascript走马灯的效果(文档标题文字滚动)

时间:2016-09-07 13:02:16      阅读:155      评论:0      收藏:0      [点我收藏+]

标签:

做一些网站的时候,文档标题会滚动,这个效果是走马灯的效果。

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>走马灯的效果</title>
	</head>
	<body>
		<script>
			var dir="";
			function zouma(){
				var tit=document.title;
				if(dir=="left"){
					var first=tit.substring(0,1);
					//console.log(first);
					var last=tit.substring(1,tit.length);
					document.title=last+first;
				}else if(dir=="right"){
					var first=tit.substring(0,tit.length-1);
					console.log(first);
					var last=tit.substring(tit.length-1);
					document.title=last+first;
				}
			}
			function strdir(d){
				dir=d;
			}
			setInterval("zouma()",600);
		</script>
		<button id="left" type="button" onclick="strdir(‘left‘)">向右滑动</button>
		<button id="right" type="button" onclick="strdir(‘right‘)">向左滑动</button>
	</body>
</html>

  这个分为向左滚动和向右滚动,默认不滚动

javascript走马灯的效果(文档标题文字滚动)

标签:

原文地址:http://www.cnblogs.com/taiyanghua0522/p/5848909.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!