<!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=utf-8" />
<title>图片滚动</title>
</head>
<body>
<style type="text/css">
<!--
#demo {
background: #FFF;
overflow:hidden;
border: 1px dashed #CCC;
width: 500px;
}
#demo img {
border: 3px solid #F2F2F2;
}
#indemo {
float: left;
width: 800%;
}
#demo1 {
float: left;
}
#demo2 {
float: left;
}
-->
</style>
<div id="demo">
    <div id="indemo">
        <div id="demo1">
            <a href="#"><img src="./images/wall_s4.jpg" border="0" /></a>
            <a href="#"><img src="./images/wall_s4.jpg" border="0" /></a>
            <a href="#"><img src="./images/wall_s4.jpg" border="0" /></a>
            <a href="#"><img src="./images/wall_s4.jpg" border="0" /></a>
            <a href="#"><img src="./images/wall_s4.jpg" border="0" /></a>
            <a href="#"><img src="./images/wall_s4.jpg" border="0" /></a>
        </div>
        <div id="demo2"></div>
    </div>
</div>
<script>
<!--
var speed=10;
var tab=document.getElementById("demo");
var tab1=document.getElementById("demo1");
var tab2=document.getElementById("demo2");
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>

javascript 不间断向左滚动图片的更多相关文章

  1. 向上下左右不间断无缝滚动图片的效果(兼容火狐和IE)

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  2. jquery 实现图片无缝向左滚动

    <script type="text/javascript" src="_pub/Script/jquery.js"></script> ...

  3. 二、JavaScript语言--JS实践--信息滚动效果制作

    运用JavaScript技术,掌握无缝滚动和歇间性滚动的制作方法. 一.marquee标签实现信息滚动 1 behavior滚动的方式 alternate:表示在两端之间来回滚动 scroll:表示由 ...

  4. jquery图片无缝滚动代码左右 上下无缝滚动图片

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  5. .net asp [转载]ASP:循环滚动图片的代码+解释

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  6. js鼠标滚轮滚动图片切换效果

    效果体验网址:http://keleyi.com/keleyi/phtml/image/12.htm HTML文件代码: <!DOCTYPE html PUBLIC "-//W3C// ...

  7. jQuery.hhLRSlider 左右滚动图片插件

    /**  * jQuery.hhLRSlider 左右滚动图片插件  * User: huanhuan  * QQ: 651471385  * Email: th.wanghuan@gmail.com ...

  8. jquery控制左右箭头滚动图片列表

    jquery控制左右箭头滚动图片列表的实例. 代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN&q ...

  9. (转载)无缝滚动图片的js和jquery两种写法

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

随机推荐

  1. 解popstar

    游戏介绍 http://baike.baidu.com/view/9773832.htm 实现过程: 实现完整的游戏逻辑,包括消除,合并等,也就是实现一个完整的游戏功能. 找出每个连通的星星区域,每个 ...

  2. make it clear how to use const in C++

    1.first of all,take a lookup on the left side of keyword const.If there is something(type or pointer ...

  3. 2 weekend110的hadoop的自定义排序实现 + mr程序中自定义分组的实现

    我想得到按流量来排序,而且还是倒序,怎么达到实现呢? 达到下面这种效果, 默认是根据key来排, 我想根据value里的某个排, 解决思路:将value里的某个,放到key里去,然后来排 下面,开始w ...

  4. Yii PHP 框架分析（二）

    Yii PHP 框架分析(二)作者:wdy http://hi.baidu.com/delphiss/blog/item/54597af595085ad3f3d38552.html Yii是基于组件( ...

  5. Tab选项卡切换卡JS效果

    <script type="text/javascript"> /* tab切换选项卡js效果 writed by *** 2010.08.13 1.currentid ...

  6. 【转】Eclipse上安装GIT插件EGit及使用

    http://yufenfei.iteye.com/blog/1750124 一.Eclipse上安装GIT插件EGit Eclipse的版本eclipse-java-helios-SR2-win32 ...

  7. way/XMPP

    http://git.oschina.net/way/XMPP

  8. java 流程执行 循环 foreach循环

    一. if分支 1. 结构  if  else if   else 2.执行原则 if  if  if 结构  会一直去执行()里的判断语句 if else if  else if 结构  只要一条( ...

  9. 获取IMEI码

    核心代码: Imei = ((TelephonyManager) getSystemService(TELEPHONY_SERVICE)).getDeviceId(); 1.加入权限 在manifes ...

  10. CentOS6.5编译安装最新MySQL 5.7.11

    安装前工作:1,从官方网址下载MySQL5.7.11源码包,大概49M2,安装好CentOS6.5 64位操作系统.建议update操作系统,以便是此版本最新的3. yum -y install  g ...