js图片滚动，鼠标经过滚动停止效果
来源：互联网 发布：命令行进入linux mysql 编辑：程序博客网 时间：2024/04/30 16:39
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>鼠标经过滚动停止效果。</title>
</head>
<style type="text/css">
<!--
#www_zzjs_net {
background: #FFF;
overflow:hidden;
border: 1px dashed #CCC;
width: 400px;
height:300px;
}
#www_zzjs_net img {
border: 3px solid #F2F2F2;
}
#indemo {
float: left;
width: 800%;
}
#demo1 {
float: left;
}
#demo2 {
float: left;
}
-->
</style>
<body>
<a href="<#ZC_BLOG_HOST#>">站长特效网</a><hr>
向左滚动
<div id="www_zzjs_net">
<div id="indemo">
<div id="demo1">
<div style="float:left;">
<div style="float: left; width:80px"><a href="#"><img src="/image/1.jpg" border="0" style="float:left" onload="return imgzoom(this,600);" onclick="javascript:window.open(this.src);" style="cursor:pointer;"/></a></div>
<div style="float: left; width:80px"><a href="#"><img src="/image/2.jpg" border="0" style="float:left" onload="return imgzoom(this,600);" onclick="javascript:window.open(this.src);" style="cursor:pointer;"/></a></div>
<div style="float: left; width:80px"><a href="#"><img src="/image/3.jpg" border="0" style="float:left" onload="return imgzoom(this,600);" onclick="javascript:window.open(this.src);" style="cursor:pointer;"/></a></div>
<div style="float: left; width:80px"><a href="#"><img src="/image/4.jpg" border="0" style="float:left" onload="return imgzoom(this,600);" onclick="javascript:window.open(this.src);" style="cursor:pointer;"/></a></div>
<div style="float: left; width:80px"><a href="#"><img src="/image/5.jpg" border="0" style="float:left" onload="return imgzoom(this,600);" onclick="javascript:window.open(this.src);" style="cursor:pointer;"/></a></div>
<div style="float: left; width:80px"><a href="#"><img src="/image/1.jpg" border="0" style="float:left" onload="return imgzoom(this,600);" onclick="javascript:window.open(this.src);" style="cursor:pointer;"/></a></div>
</div>
</div>
<div id="demo2"></div>
</div>
</div>
<script>
var speed=10;
var tab=document.getElementById("www_zzjs_net");
var tab1=document.getElementById("demo1");
var tab2=document.getElementById("demo2");
// alert(tab2.offsetWidth);
// alert(tab.scrollLeft);
// alert(tab1.offsetWidth);
tab2.innerHTML=tab1.innerHTML;
function Marquee(){
if(tab2.offsetWidth-tab.scrollLeft<=0)
tab.scrollLeft-=tab1.offsetWidth
else{
tab.scrollLeft++;
}
}
var MyMar=setInterval(Marquee,speed);
tab.onmouseover=function() {clearInterval(MyMar)};
tab.onmouseout=function() {MyMar=setInterval(Marquee,speed)};
</script>
</body>
</html>
- js图片滚动，鼠标经过滚动停止效果
- js图片滚动效果 时间随便定 鼠标移上去停止
- javascript实现的图片滚动效果，鼠标放上可停止
- js 自动滚动,鼠标移动停止滚动
- 鼠标经过链接文本内容滚动效果
- JQ简单鼠标经过li滚动图片
- js图片滚动效果
- 鼠标滚动缩放图片效果
- js图片根据鼠标左右滚动的效果
- js设置图片或文字自动左右滚动控制,鼠标经过停留
- js设置图片或文字自动左右滚动控制,鼠标经过停留
- jcarousellite插件鼠标经过和鼠标移出悬浮效果及图片小于可见数是滚动混乱
- js 滚动图片新闻效果
- js图片无缝滚动效果
- js控制图片滚动效果
- js图片滚动链接效果
- js图片各种滚动效果
- JS实现图片滚动效果
- Struts中的标签s:checkbox用处
- 挑战程序员---三角形
- SaaS平台开发人员和SaaS应用开发人员的分化对他们的技术结构有哪些不同的要求？这两类开发人员都需要具备哪些知识呢？
- 动态数组使用
- SharePoint菜鸟开发旅程
- js图片滚动，鼠标经过滚动停止效果
- 简单实现hash存储
- 新年奉献MVC+EF(CODEFIRST)+EASYUI医药MIS系统
- Bluetooth HID device 鼠标模拟触摸屏以及Android的back,home键的实现
- iOS开发的22个奇谲巧技
- 编写跨平台Java程序注意事项
- python之正则匹配
- 提供给开发者 10 款最好的 Python IDE
- java读取和遍历properties文件并根据key进行排序
