突然发现好久没来了,这些天忙着工作,悲催 !!
一个小的JS滑顿效果,虽然功能很小,在刚看到这个功能的时候我还是费了一上午,汗呐...!!
下面开始附代码:
<html>
<head>
<title>滑顿效果</title>
<script src="jquery.js" type="text/javascript"></script>
</head>
<body>
<div class="cuxiao_huodong">
<div class="img_3"></div>
<dl class="cuxiao_huodong_wz" id="cxhd_0" style="height:18px;overflow:hidden;">
<dd><a target="_blank" href="http://jc/goods-3916.html">国宝熊猫币画双绝12</a></dd>
<dd><a target="_blank" href="http://jc/goods-3960.html">2011版熊猫金银纪念币1/10盎司金币1</a></dd>
<dd><a target="_blank" href="http://jc/goods-3960.html">2011版熊猫金银纪念币1/10盎司金币2</a></dd>
<dd><a target="_blank" href="http://jc/goods-3960.html">2011版熊猫金银纪念币1/10盎司金币3</a></dd>
<dd><a target="_blank" href="http://jc/goods-3960.html">2011版熊猫金银纪念币1/10盎司金币4</a></dd>
<dd><a target="_blank" href="http://jc/goods-3960.html">2011版熊猫金银纪念币1/10盎司金币5</a></dd>
<dd><a target="_blank" href="http://jc/goods-3960.html">2011版熊猫金银纪念币1/10盎司金币6</a></dd>
<dd><a target="_blank" href="http://jc/goods-3960.html">2011版熊猫金银纪念币1/10盎司金币7</a></dd>
<dd><a target="_blank" href="http://jc/goods-3960.html">2011版熊猫金银纪念币1/10盎司金币8</a></dd>
<dd><a target="_blank" href="http://jc/goods-3960.html">2011版熊猫金银纪念币1/10盎司金币9</a></dd>
<dd><a target="_blank" href="http://jc/goods-3960.html">2011版熊猫金银纪念币1/10盎司金币10</a></dd>
<dd><a target="_blank" href="http://jc/goods-3960.html">2011版熊猫金银纪念币1/10盎司金币11</a></dd>
<dd><a target="_blank" href="http://jc/goods-13870.html">辛亥革命百年暨孙中山先生诞辰145周年大铜章13</a></dd>
<dd><a target="_blank" href="http://jc/goods-4166.html">盛世中华中国印青玉版14</a></dd>
<dd><a target="_blank" href="http://jc/goods-11160.html">Y6259缅甸生肖挂件 淡雅A货翡翠生肖吊坠 鸡 证书 正品15</a></dd>
</dl>
<div class="img_0"></div>
</div>
<script type="text/javascript">
var previous = 0;
var link = null;
var t = 100;//循环间隔时间
var waitTime = 2000;//间隔时间2s
var isScroll = true;
var t1 = 0;
function n(){
if(! isScroll) return;
var d = document.getElementByIdx_x('cxhd_0');
if(d.scrollTop==0){//18一个A框的高度
t1 += t;
if(t1 != waitTime) return; else t1=0;
}
previous = d.scrollTop;
d.scrollTop+=18;
if(d.scrollTop == previous) d.scrollTop = 0;
}
setInterval('n()',t);
</script>
</body>
</html>
这里我把#cuxiao_huodong_wz的height设置成18了,然后每次增加18个,18个停顿一次,就造成了,文字无法漫步向上走动的效果,但是避免了,文章结束时的突然出现,小bug.
总归这段JS比在网上找到的要精简的多,很实用,我们网站首页加载加上图片就要1M左右,再加一个几十K的滑动代码,就惨了.所以不得不修改啊.正在写autocomplete.祝我成功 !!
一个小的JS滑顿效果,虽然功能很小,在刚看到这个功能的时候我还是费了一上午,汗呐...!!
![javascript滑动停顿效果 javascript滑动停顿效果](https://i-blog.csdnimg.cn/blog_migrate/a4c26d1e5885305701be709a3d33442f.gif)
下面开始附代码:
<html>
</html>
这里我把#cuxiao_huodong_wz的height设置成18了,然后每次增加18个,18个停顿一次,就造成了,文字无法漫步向上走动的效果,但是避免了,文章结束时的突然出现,小bug.
总归这段JS比在网上找到的要精简的多,很实用,我们网站首页加载加上图片就要1M左右,再加一个几十K的滑动代码,就惨了.所以不得不修改啊.正在写autocomplete.祝我成功 !!