转载: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. SQLServer 数据修复命令DBCC一览

    1. DBCC CHECKDB  重启服务器后,在没有进行任何操作的情况下,在SQL查询分析器中执行以下SQL进行数据库的修复,修复数据库存在的一致性错误与分配错误. use master decla ...

  2. 朝花夕拾之--大数据平台CDH集群离线搭建

    body { border: 1px solid #ddd; outline: 1300px solid #fff; margin: 16px auto; } body .markdown-body ...

  3. [转] OpenStack Kilo 更新日志

    OpenStack 2015.1.0 (Kilo)更新日志 原文: https://wiki.openstack.org/wiki/ReleaseNotes/Kilo/zh-hans 目录  [隐藏] ...

  4. checkbox勾选判断

    var xieYi=document.getElementById("xieYi"); if(!xieYi.checked){ alert("请先阅读并勾选购买协议!&q ...

  5. 突然发现这周有点忙。。着玩-PHP进阶

    hi 周二才,不过我突然意识到这周有点忙着玩的感觉,还是很期待的——今天下午去市里,晚上回来看电影,明晚聚餐吃火锅,后天下午拍短片,晚上可能要打球,周五,嗯,就到周五了.虽然这样下去连怎么写(bian ...

  6. 第18章 图元文件_18.2 增强型图元文件(emf)(2)

    18.2.7 增强型图元文件的查看和打印程序 (1)传递EMF到剪贴板,剪贴板类型应为:CF_ENHMETAFILE (2)CopyEnhMetaFile用于复制图元文件 (3)剪贴板中的图元文件会自 ...

  7. easyUI的dateBox控制时间格式

    <input type='text' name='yearQuery' class='easyui-datebox ' data-options="formatter:myformat ...

  8. Thinkphp大纲——基础参考

    一.ThinkPHP核心文件介绍 ├─ThinkPHP.php 框架入口文件 ├─Common 框架公共文件 ├─Conf 框架配置文件 ├─Extend 框架扩展目录 ├─Lang 核心语言包目录 ...

  9. 程序流程的控制之条件分支(Delphi)

    if语句主要来检测一个条件,并根据这个条件是True或者False来执行一段代码: 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 var   I: Integer ...

  10. 如何将matlab画出的图片保存为要求精度

    · 来源:http://emuch.net/bbs/viewthread.php?tid=2705843 杂志社对投稿图片的分辨率通常有如下要求: TIFF: Colour or greyscale ...