时间:2021-05-26
原样复制后,几乎不需要改动就能用了!有问题大家讨论
复制代码 代码如下:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://putedStyle(items[i],null)["marginRight"];
}
numLeft = parseInt(numLeft);
numRight = parseInt(numRight);
numLeft += numRight;
if(numLeft>0){
widthAll += numLeft;
}
widthAll += items[i].offsetWidth;
}
widthHalf = widthAll/2;
innerCon.style.width = widthAll+"px";
if(direct == "left"){
direct = "left";
}else if(direct == "right"){
direct = "right";
}else{
direct = "left"
}
if(direct == "left"){
timer = setInterval(_scrollLeft,speed);
}else if(direct == "right"){
con.scrollLeft = widthHalf;
timer = setInterval(_scrollRight,speed);
}
con.onmouseover = function(){
if(timer){
clearInterval(timer);
timer = null;
}
}
con.onmouseout = function(){
if(direct == "left"){
timer = setInterval(_scrollLeft,speed);
}else{
timer = setInterval(_scrollRight,speed);
}
}
function _scrollLeft(){
if(con.scrollLeft<widthHalf){
con.scrollLeft += 2;
}else{
con.scrollLeft = 0;
}
}
function _scrollRight(){
if(con.scrollLeft>0){
con.scrollLeft -= 2;
}else{
con.scrollLeft = widthHalf;
}
}
}
function getChildNodes(obj){//获取元素子节点
var childList,list;
childList = new Array();
list = obj.childNodes;
for(var i=0;i<list.length;i++){
if(list[i].nodeType == 1)
childList[childList.length] = list[i];
}
return childList;
}
</script>
</head>
<body>
<div id="left_1" class="left_1">
<div class="left_1_i">
<p>1</p>
<p>2</p>
<p>3</p>
<p>4</p>
<div>b</div>
<div>a</div>
</div>
</div>
<script language="javascript">scrollSP("left_1",10,"right");</script>
</body>
</html>
声明:本页内容来源网络,仅供用户参考;我单位不保证亦不表示资料全面及准确无误,也不保证亦不表示这些资料为最新信息,如因任何原因,本网内容或者用户因倚赖本网内容造成任何损失或损害,我单位将不会负任何法律责任。如涉及版权问题,请提交至online#300.cn邮箱联系删除。
我们会看到很多的网站上会使用多张图片无缝滚动的效果。下面我就介绍几种纯JS实现多张图片的无缝滚动,并实现鼠标移到图片上运动停止的效果,可以控制图片左右滚动。1.
js替代marquee实现图片无缝滚动可能大家都碰到过,当marquee中滚动的是图片的时候,滚到终点的时候直接就跳回到起点了,而不像文字那样可以无缝滚动,下面
本文实例为大家分享了js无缝循环滚动实现代码,供大家参考,具体内容如下1、图片格式:260*400.2、使用循环定时器轻松实现无缝滚动.row{width:12
一款适用于方案和图片的JS无缝滚动代码,可控制向左或向右滚动,代码不算复杂,而且本无缝滚动代码兼容性也挺好,你几乎不需要修改什么代码,就能使用了。测试时候把那些
简单实现纵向无缝滚动(不要忘记引入jquery文件哦)看效果:1、HTML代码简单的jQuery无缝向上滚动效果简单的jQuery无缝向上滚动效果简单的jQue