转载:http://blog.sina.com.cn/s/blog_6387e82401013kx8.html

js的图片的横向或者竖向的无缝滚动图片。

ttp://zx.bjmylike.com/

http://zx.bjmylike.com/fe/release/js/index_4e1f23f.js

function marquee(e,i){
var n=document.getElementById("marquee"+e),
t=document.getElementById("marquee"+e+"_1"),
s=document.getElementById("marquee"+e+"_2");
if("up"==i)
if(s.offsetTop-n.scrollTop<=)
n.scrollTop-=t.offsetHeight+;
else
{var o=n.scrollTop;n.scrollTop++,n.scrollTop==o&&(n.scrollTop=)}
else
s.offsetWidth-n.scrollLeft<=?n.scrollLeft-=t.offsetWidth:n.scrollLeft++}
function marqueeStart(e,i){
var n=document.getElementById("marquee"+e),
t=document.getElementById("marquee"+e+"_1"),
s=document.getElementById("marquee"+e+"_2");
s.innerHTML=t.innerHTML;
var o=window.setInterval("marquee("+e+", '"+i+"')",);
n.onmouseover=function(){window.clearInterval(o)},
n.onmouseout=function(){o=window.setInterval("marquee("+e+", '"+i+"')",)}
}
$(function(){
$(".nav_second_list").mouseover(function(){$(this).addClass("nav_second_list1").find("i").addClass("ix").end().find("span").addClass("span1"),$(this).siblings().removeClass("nav_second_list1").find("i").removeClass("ix").end().find("span").removeClass("span1")}),
$(".nav_second_list").mouseout(function(){$(this).removeClass("nav_second_list1").find("i").removeClass("ix").end().find("span").removeClass("span1")}),$(".box1_lr_title a").not(":first").hide(),
$(".box1_lr_title h3").first().addClass("add_bg"),$(".box1_lr_cons").not(":first").hide(),$(".box1_lr_title h3").click(function(){$(this).siblings("a").eq($(this).index()-).show().siblings("a").hide(),$(this).addClass("add_bg").siblings("h3").removeClass("add_bg"),
$(".box1_lr_cons").eq($(this).index()-).show().siblings().hide()}),$(".next").click(function(){$(".mid_c").animate({left:"-739px"},,function(){$(".mid_c").append($(".mid_c li:first")),
$(".mid_c").css({left:"0px"})})}),$(".prev").click(function(){$(".mid_c").prepend($(".mid_c li:last")),
$(".mid_c").css({left:"-739px"}),$(".mid_c").animate({left:"0px"},,function(){})}),$("#marquee1_1 li").hover(function(){$("#marquee1_1 li").children(".box3_l_zj").stop(!,!).eq($(this).index()).animate({bottom:"0px"},)},function(){$("#marquee1_1 li").children(".box3_l_zj").stop(!,!).eq($(this).index()).animate({bottom:"-114px"},)}),$("#marquee1_2 li").hover(function(){$("#marquee1_2 li").children(".box3_l_zj").stop(!,!).eq($(this).index()).animate({bottom:"0px"},)},function(){$("#marquee1_2 li").children(".box3_l_zj").stop(!,!).eq($(this).index()).animate({bottom:"-114px"},)})
}),
marqueeStart(,"left");

css 图片的无缝滚动的更多相关文章

  1. jquery 图片自动无缝滚动

    <!DOCTYPE html><html><head> <meta charset="utf-8"> <meta http-e ...

  2. DIV+CSS图片不间断滚动jquery特效(Marquee插件)及移动标签marquee整理

    推荐一个jQuery的无缝文字滚动效果,同时也可以滚动图片,也叫做跑马灯效果. 此jquery插件,依托jquery库,能实现各种滚动效果,且让HTML代码符合W3C标准. marquee标签:创建一 ...

  3. 用js实现图片的无缝滚动效果

    实现图片的无缝滚动就是要让你的图片集在一定时间里自动切换,那就需要js里的定时器来控制时间. js中关于定时器的方法有两种:setTimeout和setInterval.它们接收的参数是一样的,第一个 ...

  4. js 实现图片的无缝滚动

      js 实现图片的无缝滚动 CreateTime--2018年3月7日17:18:34 Author:Marydon 测试成功 <!DOCTYPE html> <html> ...

  5. Javascript实现 图片的无缝滚动

    <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <m ...

  6. SuperSlidev2.1 轮播图片和无缝滚动

    使用方法,狠狠的点击下面链接 http://down.admin5.com/demo/code_pop/18/562/index.html 简单使用方法如下 html <div class=&q ...

  7. CSS实现简单无缝滚动

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  8. js 图片实现无缝滚动

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

  9. JavaScript(六)——实现图片上下或者左右无缝滚动

    /*! jQuery v1.8.3 jquery.com | jquery.org/license */ (function(e,t){function _(e){var t=M[e]={};retu ...

随机推荐

  1. Linux IPC udp/ip socket 编程

    模型 #include <unistd.h> #include <sys/types.h> #include <sys/socket.h> #include < ...

  2. android 利用Path.cubicTo 画 贝塞尔曲线

    Path.cubicTo void android.graphics.Path.cubicTo(float x1, float y1, float x2, float y2, float x3, fl ...

  3. java 如何在pdf中生成表格

    1.目标 在pdf中生成一个可变表头的表格,并向其中填充数据.通过泛型动态的生成表头,通过反射动态获取实体类(我这里是User)的get方法动态获得数据,从而达到动态生成表格. 每天生成一个文件夹存储 ...

  4. S5PV210的内存分配研究分析

    S5PV210内存一般会使用SDRAM和DDR2 (DDR SDRAM),SDRAM的uboot启动网络已经有很多资料的,对于DDR2还有有很多疑惑,如果有错误的地方,请大家一定指出,醍醐灌顶,不胜感 ...

  5. 使用Tcmalloc进行堆栈分析

    在前一篇译文<使用TCmalloc的堆栈检查>,介绍了Tcmalloc进行堆栈检查,今天翻译<heap-profiling using tcmalloc>,了解如何 TCmal ...

  6. windows下 MySQL手动安装与卸载

    下载文件以后进行解压 ,指定文件的具体位置 1.安装 选择路径下的mysqld --intall 指定服务名称  --设置配置文件 例子: C:\Users\Administrator\Desktop ...

  7. AngularJS几个基础概念

    作用域 应用的作用域是和应用的数据模型相关联的,同时作用域也是表达式执行的上下文.$scope对象是定义应用业务逻辑.控制器方法和视图属性的地方.作用域是视图和作用域之间的胶水.在应用将视图渲染并呈现 ...

  8. hdu-5933----hdu-5943

    hdu-5933 思路: 贪心,首先要求总和是k的倍数,而又要求相邻,说明相邻的一块如果是sum/k的倍数,那么就地切割这样才能使操作数目最少; hdu-5934 思路: 强连通分量,可以找出强连通分 ...

  9. Docker Network containers

    Network containers Estimated reading time: 5 minutes If you are working your way through the user gu ...

  10. Unity实现刺客信条灯光的思路探究

    灯光需求 类似刺客信条的开场CG动画,场景中打着酷炫的灯光,玩家在场景中行走可以感受到灯光很真实. 参考视频:http://www.iqiyi.com/w_19rqytbmvt.html 运行环境 安 ...