css 图片的无缝滚动
转载:http://blog.sina.com.cn/s/blog_6387e82401013kx8.html
js的图片的横向或者竖向的无缝滚动图片。
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 图片的无缝滚动的更多相关文章
- jquery 图片自动无缝滚动
<!DOCTYPE html><html><head> <meta charset="utf-8"> <meta http-e ...
- DIV+CSS图片不间断滚动jquery特效(Marquee插件)及移动标签marquee整理
推荐一个jQuery的无缝文字滚动效果,同时也可以滚动图片,也叫做跑马灯效果. 此jquery插件,依托jquery库,能实现各种滚动效果,且让HTML代码符合W3C标准. marquee标签:创建一 ...
- 用js实现图片的无缝滚动效果
实现图片的无缝滚动就是要让你的图片集在一定时间里自动切换,那就需要js里的定时器来控制时间. js中关于定时器的方法有两种:setTimeout和setInterval.它们接收的参数是一样的,第一个 ...
- js 实现图片的无缝滚动
js 实现图片的无缝滚动 CreateTime--2018年3月7日17:18:34 Author:Marydon 测试成功 <!DOCTYPE html> <html> ...
- Javascript实现 图片的无缝滚动
<!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <m ...
- SuperSlidev2.1 轮播图片和无缝滚动
使用方法,狠狠的点击下面链接 http://down.admin5.com/demo/code_pop/18/562/index.html 简单使用方法如下 html <div class=&q ...
- CSS实现简单无缝滚动
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- js 图片实现无缝滚动
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- JavaScript(六)——实现图片上下或者左右无缝滚动
/*! jQuery v1.8.3 jquery.com | jquery.org/license */ (function(e,t){function _(e){var t=M[e]={};retu ...
随机推荐
- mysql-2 mysql客户端
mysql 官方客户端 MySQL-Workbench 下载链接http://dev.mysql.com/downloads/workbench/ 具体安装步骤就不写了,直接一直下一步就可以了. 下 ...
- 今天说一下DML触发器的顺序
因为05之后的版本允许了一个对象有多个after触发器,所以呢~顺序方面还是要留意一下下的.比如我现在要往一个测试表里面添加多个触发器. USE Test GO ,),Name )) GO CREAT ...
- iOS 读取相册二维码,兼容ios7(使用CIDetector 和 ZXingObjC)
ios从相册读取二维码,在ios8以上,苹果提供了自带的识别图片二维码的功能,这种方式效率最好,也是最推荐的,但是如果你的系统需要向下兼容ios7,就必须用其他方式. 这里我选择的是 ZXingObj ...
- Linux系统监控命令之iotop
iotop命令 iotop命令是一个用来监视磁盘I/O使用状况的top类工具.iotop具有与top相似的UI,其中包括PID.用户.I/O.进程等相关信息.Linux下的IO统计工具如iostat, ...
- mysql 性能优化方案 (转)
网 上有不少mysql 性能优化方案,不过,mysql的优化同sql server相比,更为麻烦与复杂,同样的设置,在不同的环境下 ,由于内存,访问量,读写频率,数据差异等等情况,可能会出现不同的结果 ...
- 查看linux系统,服务,配置文件被修改的时间
如何查看服务启动时间 [root@qike /]# ps -ef |grep nginx root 14730 1 0 16:45 ? 00:00:00 nginx: master process / ...
- 地产cio揭秘:帆软大商业智能解决方案如何助力地产行业信息化
一. 地产行业信息化现状 房地产企业核心竞争能力的提升,需要强壮的企业运营管理能力,需要及时.准确.全面的业务数据分析作为参考与支撑.然而很多房地产企业缺乏能够集中体现企业运营活动状况的.全 ...
- Android可移动控件
可移动控件: 效果图: 获取屏幕的宽高: DisplayMetrics dm = getResources().getDisplayMetrics(); screenWidth = dm.widthP ...
- leetcode-HouseRobber
这道题比较简单,所以我会介绍的比较粗略: 题目: 有一个小偷想沿着马路上的房子偷东西,每家每户都有一些钱,但这条街上装了监控系统,如果相邻的两户人家都被偷了的话那么就会触发报警器.小偷的目标就是在不触 ...
- Flash 二进制传图片到后台Java服务器接收
需求:把客户端处理过的图片返还给服务器Flash端代码 01 package {02 import com.adobe.images.JPGEncoder; 03 import ...