链接图片无缝(无间断)向左平滑滚动Js版代码
向左无缝滚动
body,html,div,a{ margin:0; padding:0}
#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;
margin-left:7px;
}
window.onload = function(){
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
向左无缝滚动
[Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]
相关推荐
-
js实现用滚动条来放大缩小图片的代码
这段时间比较闲,就搞了这么一个功能来练练手. 因为没有系统的学习过javascript,很多东西都是现学现用.请大家多提宝贵意见,谢谢 无标题文档 //---------------------------------------------------------------------------------------------- // 功能说明:用于放大图片的滚动条,可放大至图片的原始大小.在ie6,ie7,ff1.5下可用 // 使用方法:在图片代码里加上resizeable=1,同
-
JavaScript实现页面滚动图片加载(仿lazyload效果)
为什么写这篇文章? 1.优化页面很实用的方法,技术实现不难: 2.搜索了相关内容的文章,好像都是用jQuery的方法,可是如果不用jQuery的站长难道就不能用这种方法了么: 3.做技术分享也是在让更多人帮自己测试,因为这个本人木有在项目中实际用到,都是自己琢磨的,所有如果有问题请大家指出,先谢谢了: 4.这个月的博客还没写: 5.刚好木有工作任务,此时不写更待何时... 现在的页面大多都具有的特点 - 内容丰富,图片较多:像我们经常浏览的淘宝,京东,团购网站之类的(本人网购控,属于一个月不在网
-
JS简单的轮播的图片滚动实例
[javascript] 复制代码 代码如下: var forimg = function (foritem, hoverStop, defaultfor) { var _foritem = foritem.constructor == jQuery ? foritem : $(foritem); var imgarr = [ { "z-index": 1, "width": 100, "he
-
JS实现图片横向滚动效果示例代码
复制代码 代码如下: <!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=&qu
-
用js实现的一个Flash滚动轮换显示图片代码生成器
复制代码 代码如下: <!--文件头模板--> <SCRIPT src=top.js></SCRIPT> <SCRIPT language=javascript> writeTop('Flash滚动显示图片代码生成','2006-10-18'); </SCRIPT> <!--以下为内容--> <SCRIPT> //运行代码 function runEx(cod1) { cod=document.getE
-
js+div实现图片滚动效果代码
横向 <div id=demo style="overflow:hidden;width:200px;border:2px solid #e0e0e0;padding:2px;" onmouseover="stopscroll();" onmouseout="doscroll()"> <div id="demo1" style="white-space:nowrap;padding:0;"
-
JavaScript实现简单精致的图片左右无缝滚动效果
本文实例讲述了JavaScript实现简单精致的图片左右无缝滚动效果.分享给大家供大家参考,具体如下: <!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"
-
JS实现div内部的文字或图片自动循环滚动代码
复制代码 代码如下: <style type="text/css"> .content{width:500px;height:300px;position:absolute;left:200px;top:100px;border:solid 2px red;padding:10px;overflow:hidden} dl{width:400px;height:30px;border:1px solid black;} </style> <div class
-
js实现图片无缝滚动特效
首先,无缝滚动的第一个重点就是--动.关于怎么让页面的元素节点动起来,这就得学明白关于JavaScript中定时器的相关知识. JS中的创建定时器的方法包括两种:setTimeout和setInterval.首先它们接收的参数相同:第一个参数是一个函数,用于定时器执行,第二个参数是一个数字,代表过多少毫秒之后定时器执行函数.它们的不同在于:setTimeout 是在经过指定的时间之后,只执行一次函数,而setInterval,则是每间隔指定时间,就执行函数一次,说简单点的话,就是setInter
-
js jquery做的图片连续滚动代码
核心代码如下,大家可以参考 复制代码 代码如下: <script src="/js/jquery.js"></script> <script> $(document).ready(function(){ $(".bannerbutton li").each( function(){ $(this).click(
-
JS图片无缝、平滑滚动代码
非常平滑的JS图片滚动特效代码,无缝循环,速度可自定义,鼠标悬停时停止.它的特点是JS和图片地址分离,这样做你就经易的从数据库动态调用每张图片的地址,方便控制,因此它非常的应用. 复制代码 代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <ht
-
javascript 不间断的图片滚动并可点击
css: 复制代码 代码如下: <style type="text/css"> .rollBox { width: 704px; overflow: hidden; padding: 12px 0 5px 6px; } .rollBox .LeftBotton { height: 52px; width: 19px; background: url(jt.gif) no-repeat 11px 0; overflow: hidden; float: left; displa
随机推荐
- Access保留字&变量名列表
- 6种javascript显示当前系统时间代码
- java中多态概念、实现原理详解
- Python抓取手机号归属地信息示例代码
- golang image图片处理示例
- Bootstrap按钮功能之查询按钮和重置按钮
- smarty实现多级分类的方法
- WordPress中查询文章的循环Loop结构及用法分析
- php生成随机颜色方法汇总
- 将文件夹压缩成zip文件的php代码
- Python编程之序列操作实例详解
- 检查access数据库中是否存在某个名字的表的asp代码
- shell脚本实现输入密码显示星号
- Struts2学习笔记(3)-DMI动态调用方式
- SqlServer将查询结果转换为XML和JSON
- NoSQL反模式 - 文档数据库篇
- setTimeout内不支持jquery的选择器的解决方案
- Javascript 构造函数详解
- Python使用email模块对邮件进行编码和解码的实例教程
- C++实现单链表删除倒数第k个节点的方法