当前位置:首页>开发>正文

我想用Jquery做一个图片跑马灯效果,大概思路是怎么样的 关于javascript做跑马灯的效果练习问题

2023-06-21 14:20:05 互联网 未知 开发

 我想用Jquery做一个图片跑马灯效果,大概思路是怎么样的 关于javascript做跑马灯的效果练习问题

我想用Jquery做一个图片跑马灯效果,大概思路是怎么样的?

css上就是设置border就好了 js上就用setInterval定时器来模拟循环 用随机数(要限制大小和奖品对应的错开数据)生成一个要跑起来的数量 比如生成了23,那去至少一半就是11.几取整数11 然后var a = 0 a 在设置一个变量控制定时器的速度 var b = 500ms开始 b -= 500/11 取整数45ms 那定时器运行起(b = b- 45)来就越来越快,判断a 大于等于11的时候 b就该数值越来越大b = b 45 当a等于23的时候就clearInterval()清除定时器,这样就达到了跑来的时候开始由慢变快,在由快变慢最后停止的效果。a就对应的图片张数的索引,要判断比如只有10张图 那a要是索引是10的时候 也就是对应的11张图 没有11张 那就是第一张图。。。。。

关于javascript做跑马灯的效果练习问题

代码有两个问题
1 你把true写成了ture。。
2 你生成了好几个定时器,最开始设置一个,以后每次把它清空重新赋值,这样就不会乱跑了

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>javascript做简单的跑马灯练习</title>
<script type="text/javascript" language="javascript">
var varBool = false
var run
function scrollleft() {
varBool = true
var title = document.title
var scrollleft = title.charAt(0)
var scrolllast = title.substring(1, title.length)
document.title = scrolllast scrollleft

}
function scrollright() {
varBool = false
var title = document.title
var scrollright = title.charAt(title.length - 1)
var scrollright1 = title.substring(0, title.length - 1)
document.title = scrollright scrollright1

}
function judge() {
if (varBool = true) {
//clearInterval(setInterval("scrollleft()", 500))
clearInterval(run)
run=setInterval("scrollright()", 500)
}
else {
//clearInterval(setInterval("scrollright()", 500))
clearInterval(run)
run=setInterval("scrollleft()", 500)
}
}
run=setInterval("scrollleft()",500)
</script>

</head>
<body>
<center>
<input type="button" value="向左转" onclick="judge()"/>
<input type="button" value="向右转" onclick="judge()"/>
</center>
</body>
</html>

最新文章