<!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. Oracle创建表空间、创建用户、授权用户、导入dmp备份语句

    create tablespace TOPSCF_CHS_TS datafile 'D:\TableSpace\TOPSCF_CHS_TS.dbf' size 512M  extent managem ...

  2. MediaInfo源代码分析 2:API函数

    本文主要分析MediaInfo的API函数.它的API函数位于MediaInfo.h文件中的一个叫做MediaInfo的类中. 该类如下所示,部分重要的方法已经加上了注释: //MediaInfo类 ...

  3. Web资源文件的加载

    一.关于页面跳转的一下几种方法: package com.gqx.load; import java.io.IOException; import java.io.PrintWriter; impor ...

  4. 如何屏蔽Button setClickable与setEnabled

    今天想让按键暂时无效,满足一定条件下才可以被用户按到.最初以为是setClickable,谁知搞错了.请看手册: 复制代码代码如下: public void setClickable (boolean ...

  5. Android Dev

    [2015-04-22 13:30:37 - branch_1.5.1_WelcomeActivity] R.java was modified manually! Reverting to gene ...

  6. 利用Ajax把前端的数据封装成JSON格式发送到服务器端并写成XML格式在服务器的硬盘上

    1.首先要在前端把要发送的东西(这里是一个实例化的car对象)都准备好,利用Ajax发送到服务器端,代码如下: <html xmlns="http://www.w3.org/1999/ ...

  7. Android自动关机代码

    http://www.open-open.com/lib/view/open1409209890713.html 要实现自动关机的功能需要手机有root权限,如果手机有root权限,运行该程序时,会提 ...

  8. 像C++一样写JavaScript

    像C++一样写JavaScript C/C++/Java的include或import可以引用第3方文件和包. 这个功能在Html/Js里没有默认的实现. 假设我们有这样一个HTML文件index.h ...

  9. oracle4

    分页查询 按雇员的id号升序取出 oracle的分页一共有三种方式 .根据rowid来分   ) ) order by cid desc; 执行时间0.03秒 .按分析函数来分   and rk> ...

  10. apache kafka源码分析-Producer分析---转载

    原文地址:http://www.aboutyun.com/thread-9938-1-1.html 问题导读1.Kafka提供了Producer类作为java producer的api,此类有几种发送 ...