87,997
社区成员
发帖
与我相关
我的任务
分享怎样让文字或图片平滑滚动？
怎样让文字或图片平滑滚动？
用marquee的话，速度快一点就一顿一顿的，晃眼睛
用类似下面的代码，有时候内容少会不滚动，有一些文字类的甚至都不滚动
// var speed1 = 15;
// demo5.innerHTML = demo4.innerHTML;
// function Marquee1(){
// if(demo5.offsetWidth - demo3.scrollLeft <= 0)
// demo3.scrollLeft -= demo4.offsetWidth;
// else{
// demo3.scrollLeft++;
// }
// }
// var MyMar1=setInterval(Marquee1,speed1);
// demo3.onmouseover=function() {clearInterval(MyMar1)}
// demo3.onmouseout=function() {MyMar1=setInterval(Marquee1,speed1)}
请问有什么好方法实现平滑滚动呢？还是我用的代码不对？
用marquee的话，速度快一点就一顿一顿的，晃眼睛
用类似下面的代码，有时候内容少会不滚动，有一些文字类的甚至都不滚动
// var speed1 = 15;
// demo5.innerHTML = demo4.innerHTML;
// function Marquee1(){
// if(demo5.offsetWidth - demo3.scrollLeft <= 0)
// demo3.scrollLeft -= demo4.offsetWidth;
// else{
// demo3.scrollLeft++;
// }
// }
// var MyMar1=setInterval(Marquee1,speed1);
// demo3.onmouseover=function() {clearInterval(MyMar1)}
// demo3.onmouseout=function() {MyMar1=setInterval(Marquee1,speed1)}
请问有什么好方法实现平滑滚动呢？还是我用的代码不对？
...全文
请发表友善的回复…
发表回复
cjh200102 2010-11-16
- 打赏
- 举报
共同交流进步
hch126163 2010-11-15
- 打赏
- 举报
呵呵，我是最近晚上比较闲，挣点专家分！我是看到能帮得上忙的，就说2句。不知道的，就自己看看高手的解决办法，自己也学知识！
jsps2t89 2010-11-15
- 打赏
- 举报
[Quote=引用 3 楼 hch126163 的回复:]
MSClass (Class Of Marquee Scroll通用不间断滚动JS封装类
[/Quote]
大哥，你别跟在我后面发帖啊，会让人误会我是你的马甲，马甲又不好，我是个纯洁上进的菜鸟，我是个端着枪眯着眼猫着腰迈着小碎步前进的菜鸟，我是个每天晚上回来后打开辣椒酱，然后夹到热腾腾的馒头里，配口茉莉花茶惬意生活的菜鸟，我不是马甲，吼!!!!
MSClass (Class Of Marquee Scroll通用不间断滚动JS封装类
[/Quote]
大哥，你别跟在我后面发帖啊，会让人误会我是你的马甲，马甲又不好，我是个纯洁上进的菜鸟，我是个端着枪眯着眼猫着腰迈着小碎步前进的菜鸟，我是个每天晚上回来后打开辣椒酱，然后夹到热腾腾的馒头里，配口茉莉花茶惬意生活的菜鸟，我不是马甲，吼!!!!
itzhiren 2010-11-14
- 打赏
- 举报
太感谢了，我去试一下
hch126163 2010-11-14
- 打赏
- 举报
jsps2t89 2010-11-14
- 打赏
- 举报
不论是内容是文字还是图片，只要你放到代码指定的层上就会水平来回滑动
jsps2t89 2010-11-14
- 打赏
- 举报
<script>
var toRight=true;
function move(){
//浏览器的宽度
var bWidth=document.documentElement.clientWidth;
//图片所在层的宽度
var divWidth=document.getElementById("myDiv").offsetWidth;
//图片左边界能到达到右边的最大距离
var maxLeft=bWidth-divWidth;
//图片左边距离到浏览器最左边的距离
var left=document.getElementById("myDiv").style.pixelLeft;
//判断
if(left<0)
{
toRight=true;
}
if(left>maxLeft)
{
toRight=false;
}
if(toRight)
{
//图片向右走
document.getElementById("myDiv").style.pixelLeft+=2;
}else
{
document.getElementById("myDiv").style.pixelLeft-=2;
}
//移动的方法
setTimeout("move()",10);
}
window.onload=move;
</script>
</head>
<body >
<div id="myDiv" style="position:absolute">
<img src="exclam.gif" >
</div>
</body>
</html>
经过测试发给你，可以直接复制代码到dreamweaver中试试
var toRight=true;
function move(){
//浏览器的宽度
var bWidth=document.documentElement.clientWidth;
//图片所在层的宽度
var divWidth=document.getElementById("myDiv").offsetWidth;
//图片左边界能到达到右边的最大距离
var maxLeft=bWidth-divWidth;
//图片左边距离到浏览器最左边的距离
var left=document.getElementById("myDiv").style.pixelLeft;
//判断
if(left<0)
{
toRight=true;
}
if(left>maxLeft)
{
toRight=false;
}
if(toRight)
{
//图片向右走
document.getElementById("myDiv").style.pixelLeft+=2;
}else
{
document.getElementById("myDiv").style.pixelLeft-=2;
}
//移动的方法
setTimeout("move()",10);
}
window.onload=move;
</script>
</head>
<body >
<div id="myDiv" style="position:absolute">
<img src="exclam.gif" >
</div>
</body>
</html>
经过测试发给你，可以直接复制代码到dreamweaver中试试
