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

<script type="text/javascript">

$(function () {
var demo = $("#demo");
var demo1 = $("#demo1");
var demo2 = $("#demo2");
demo2.html(demo1.html());
function Marquee() {
//无缝向左滚动
if (demo.scrollLeft() > demo1.width()) {
demo.scrollLeft(0);
} else {
demo.scrollLeft(demo.scrollLeft() + 1);

}

}
var speed = 20;
var myMar = setInterval(Marquee, speed);

demo.mouseover(function () {
clearInterval(myMar);
});

demo.mouseout(function () {
myMar = setInterval(Marquee, speed);
});

})

</script>

<div id="demo" style="overflow:hidden;width:1280px;" >

<table style="border:1px;flex-align:center;" cellpadding="1" cellspacing="1">
<tr>
<td id="demo1" valign="top" bgcolor="ffffff">
<table border="0" cellspacing="0" cellpadding="0">
<tr align="center">
<td><img src="skin/images2/1.png" width="265" height="163" alt="图"/></td>   这几张图的总宽度大于1280px;才能在循环2次之后继续滚动
<td><img src="skin/images2/2.png" width="265" height="163" alt="图"/></td>
<td><img src="skin/images2/3.png" width="265" height="163" alt="图"/></td>
<td><img src="skin/images2/4.png" width="265" height="163" alt="图"/></td>
<td><img src="skin/images2/5.png" width="265" height="163" alt="图"/></td>

</tr>
</table>
</td>
<td id="demo2" valign="top"></td>
</tr>
</table>

</div>

jquery 实现图片无缝向左滚动的更多相关文章

  1. js和jquery实现图片无缝轮播的不同写法

    多掌握一种方法总是会有好处的,学习编程就要多思考,举一反三 下面写一下实现图片自动播放的代码,由于学习的是javascript,代码量很大,所以又学习了jquery库的操作,非常简便 还有非常有逼格的 ...

  2. jquery特效:无缝向上循环滚动列表

    效果呈现 整个列表间隔设定的时间向上移动一个item的高度 html结构: <div class="slide-title"> <span>title1&l ...

  3. 利用jquery实现向左滚动效果及offset的使用

    昨天和今天做了一个轮播图,它的tab标签不是1,2,3这样的数据表示,而是使用圆圈表示,效果如下:

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

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

  5. CSS和jQuery分别实现图片无缝滚动效果

    一.效果图 二.使用CSS实现 <!DOCTYPE html> <html> <head> <meta charset="utf-8"&g ...

  6. jQuery图片无缝滚动JS代码ul/li结构

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

  7. jQuery图片无缝滚动

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

  8. Jquery+css实现图片无缝滚动轮播

    Today,在XX学院的教学视频中,偶尔看到了Jquery+css实现图片无缝滚动轮播视频教程,虽然以前已写过类似的,但是我感觉他学的比较精简.为了方便以后做项目时直接拷贝,特地写出来,顺便和大家分享 ...

  9. JavaScript学习笔记5 之 计时器 & scroll、offset、client系列属性 & 图片无缝滚动

    一.计时器 setInterval ( 函数/名称 , 毫秒数 )表示每经过一定的毫秒后,执行一次相应的函数(重复) setTimeout ( 函数/名称 , 毫秒数 ) 表示经过一定的毫秒后,只执行 ...

随机推荐

  1. 解决yii2中 Class yii/web/JsonParser does not exist, ReflectionException问题

    最近在调试RESTful API示例时,出现以下错误: { "name": "Exception", "message": "Cl ...

  2. SpringBoot应用的集成测试

    一.概念和定义 进行软件开发的时候,我们会写很多代码,不过,再过六个月(甚至一年以上)你知道自己的代码怎么运作么?通过测试(单元测试.集成测试.接口测试)可以保证系统的可维护性,当我们修改了某些代码时 ...

  3. R语言学习 第九篇:plyr包

    在数据分析中,整理数据的本质可以归纳为:对数据进行分割(Split),然后应用(Apply)某些处理函数,最后将结果重新组合(Combine)成所需的格式返回,简单描述为:Split - Apply ...

  4. Android:CheckBox控件

    1)ChexkBox继承自CompoundButton组件: 2)isChecked()--确定是否选中:setChecked(bool checked)--设置选中或取消选中: 3)监听事件:Com ...

  5. 收藏:视频网站(JavaEE+FFmpeg)/Nginx+ffmpeg实现流媒体直播点播系统

    FFmpeg安装(windows环境)http://www.cnblogs.com/xiezhidong/p/6924775.html 最简单的视频网站(JavaEE+FFmpeg)http://bl ...

  6. POJ-3069 Saruman's Army---区间选点

    题目链接: https://vjudge.net/problem/POJ-3069 题目大意: 在一条直线上,有n个点.从这n个点中选择若干个,给他们加上标记.对于每一个点,其距离为R以内的区域里必须 ...

  7. jmc远程连接windows环境tomcat

    新人报道,先发个小贴赚点人气,本人目前还是小菜鸟,想要飞却怎么也飞不高,哈哈,转到正题,最近发现这个JMC挺好用的,而且也不用像Jprofile需要破解,本地连接挺方便的, 但配置服务器确实挺坑的,按 ...

  8. SpringContextUtil 的配置和调用

    首先:在springmvc里面配置 <bean id="springContextUtil" class="com.hna.hka.rmc.common.util. ...

  9. [LeetCode] Max Chunks To Make Sorted II 可排序的最大块数之二

    This question is the same as "Max Chunks to Make Sorted" except the integers of the given ...

  10. 织云Lite发布:详解包管理核心能力

    本文由 织云平台团队 发布于 腾讯云云+社区 织云Lite发布 腾讯织云自动化运维体系经过10年技术积淀,维护近万个业务模块,超过20万节点.鉴于业界朋友的呼声,我们将织云的核心功能独立抽象出来,凝结 ...