1、html结构
<div class="numberRun1"></div>
2、js
<script type="text/javascript" src="js/digital_over.js" ></script>//引用 //这是自定义函数（需要在页面中进行调用） <script> //数字滚动function digitalScroll(obj,n){ var numRun = $(obj).numberAnimate({num:n, speed:2000, symbol:","}) var nums = n setInterval(function(){numRun.resetData(nums) },3000) var numWidth= $(obj).width() $(obj).find('.mt-number-animate').css('width',numWidth) $(obj).css('width','100%') $(obj).find('.mt-number-animate').css('margin','0 auto') }window.indexdigitalScroll=function(){ digitalScroll($('.numberRun1'),1160518) } </script> <!--这是在页面中调用的方法--> <script> $(function(){ indexdigitalScroll() }) </script>
3、图片案例
推荐使用<marquee>实现图片滚动,示例:<marquee
scrolldelay="100"
direction="up"
onmouseover="this.stop()"
onmouseout="this.start()"><img
src="xxxxxxx"></marquee>
其中scrolldelay="100"
===>指滚动延迟时间,单位是毫秒ms,默认为90ms
direction="up"
===>指滚动方向,默认从左往右,可取的值为:up,down,left,right
onmouseover="this.stop()"
===>指鼠标悬停在图片上时,图片静止
onmouseout="this.start()"
===>指鼠标离开图片时,图片运动
希望对您有所帮助
<script type="text/javascript">$(document).ready(function() {
var Top = -400 //定义一个向上移动的距离，这个数值和你图片或DIV的高度相等
var Time = 500 //定义一个速度
function move() {
if ($("#box").is(":animated")) return
$("#box").animate({
"margin-top": Top
}, Time) //animate方法，只能对数值型的值进行渐变
Top += -400 //运行一次增加一个图片的高度
if (Top == -800) //判断当总高度大于你DIV或者图片总高度
{
Top = 0 //把距离设置回0
Time = 500 //加快移动速度
} else {
Time = 500 //否则减慢速度
}
}
setInterval(move, 6000) //3秒执行一次move()
})
</script>
