位置：首页>> 网络编程>> JavaScript>> 一个滑动展示的小代码

一个滑动展示的小代码

作者：lonelystar　　发布时间：2011-07-01 12:58:05　

标签：滑动,鼠标

一个写给别人的小代码

顺便也贴上来

这是一个滑动展示用的小容器

通过鼠标移动和离开触发滑动效果

<!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="Content-Type" content="text/html; charset=UTF-8" /> <title>12.1 www.cidianwang.com</title> <meta name="Generator" content="EditPlus"> <meta name="Author" content=""> <meta name="Keywords" content=""> <meta name="Description" content=""> <style> #test {width:400px;height:200px;position:relative;overflow:hidden;margin:100px auto} #test div {width:190px;height:200px;position:absolute;} #d0{background:red;} #d1{background:#000;left:100px;color:#fff;} #d2{background:blue;left:200px;} #d3{background:gray;left:300px;} </style> </head> <body> <div id="test" onmouseout="TestEle(this,event,ResetDiv)"> <div id="d0" onmouseover="ChkDivMove(0)">一</div> <div id="d1" onmouseover="ChkDivMove(1)">二</div> <div id="d2" onmouseover="ChkDivMove(2)">三</div> <div id="d3" onmouseover="ChkDivMove(3)">四</div> </div> <script type="text/javascript"> var $=function(id){return document.getElementById(id)}, Timer=[null,null,null,null], ODiv=[0,100,200,300], ChkDivMove=function(N){ var i=Timer.length,L=ODiv.length; while(i--){clearTimeout(Timer[i]),Timer[i]=null;} i=N; while(i>-1)LeftScrollDiv(i,70*i--); for(i=N+1;i<L;i++)RightScrollDiv(i,(i-1)*70+190); }, LeftScrollDiv=function(i,MinX){ var lx=ODiv[i]; (function(){ lx>MinX&&($('d'+i).style.left=--lx+'px',ODiv[i]=lx,Timer[i]=setTimeout(arguments.callee,1)) })(); }, RightScrollDiv=function(i,MaxX){ var lx=ODiv[i]; (function(){ lx<MaxX&&($('d'+i).style.left=++lx+'px',ODiv[i]=lx,Timer[i]=setTimeout(arguments.callee,1)) })(); }, ResetDiv=function(){ var i,lx; for(i=Timer.length;i--;){clearTimeout(Timer[i]),Timer[i]=null;} i=ODiv.length; while(--i)ODiv[i]>(lx=i*100)?LeftScrollDiv(i,lx):RightScrollDiv(i,lx) }, TestEle=function(obj, e,CallBack){ e.currentTarget?(e.relatedTarget != obj&&obj != e.relatedTarget.parentNode&&CallBack()):(e.toElement != obj&&obj != e.toElement.parentNode&& CallBack() ) } </script> </body> </html>

0

投稿

猜你喜欢

encodeURIComponent用法UrlEncode与URLEncode.encode()
<script>alert(escape("人"));alert(encodeURI("人&quo
最全的MYSQL备份方法
本人曾经用过的备份方式有:mysqldump、mysqlhotcopy、BACKUP TABLE 、SELECT INTO OUTFILE，
Oracle PL/SQL入门慨述
一、PL/SQL出现的目的结构化查询语言(Structured Query Language，简称SQL)是用来访问关系型数据库一种通用语
用一个例子来认识innerText，innerHTML
运行下面的代码你就可以清楚的认识到这两个参数的用法,innerText只能动态的改变指定元素内的文本内容，而innerHTML则不仅仅可以改
用滤镜使网页图片产生旋转效果
Rotation滤镜可以使图片产生旋转效果，注意必须是IE5.5及IE6.0才能看到！方法如下：制作过程：一、准备图片1张。二、建立一个CS
Flash连接服务器
近日，有朋友一直打听flash连结服务器相关的知识，搞得我忧心重重，重点是自己也忘记了，大部分Flash的相关开发都是两年前的事，而且fla
ActionScript3.0是革命性的
上个周末去书店时碰巧看到了AS3 CookeBook，我记得在apollo的alpha版快出来的时候，7yue就推荐过这个小册子，只不过我已
CGArt®2008 贺岁刊电子杂志玉鼠闹春
CGArt®2008“贺岁刊”玉鼠闹春，700页再造巅峰本期CGArt杂志信息：下载地址：http://cgart.cgfi
asp数组使用特法
每个写asp程序人必会的知识！在ASP编程中使用数组数组的定义Dim MyArrayMyArray = Array(1,5,123,12,9
MySQL 视图,第1349号错误
把下面SQL里的SELECT单独执行,没有问题,但是用来CREATE VIEW 就报错了.CREATE OR REPLA
asp如何做一个树状展开视图来显示自己的记录结构？
如何做一个树状展开视图来显示自己的记录结构？在SQL中，如何做一个可收起和展开树状结构图？就是资源管理器左栏的那种效果。这要用到Data s
将多宿主计算机配置为SQL Server访问
当服务器必须提供与两个或更多个网络或网络子网的连接时，典型的方案是使用多宿主计算机。此计算机通常位于外围网络（也称为 DMZ、外围安全区域或
如何做好一份前端工程师的简历？
春节前在蓝色理想上发了个“雅虎口碑招聘前端工程师 ”的启事，节后收到很多简历，加之HR通过专业招聘网站得到的简历和朋友同事推荐的简历，数量上
asp连接SQL和Access数据代码(asp里的随机函数)
asp连接sql 第一种写法：代码如下: MM_conn_STRING = "Driver={SQL Server};serv
如何控制弹出一个NTLM验证窗口？
用下列代码可在控制弹出NTLM验证窗口：<％ Response.Status = "401 Unauthorized&quo
Oracle RMAN快速入门指南
前言: 这篇文章主要介绍RMAN的常用方法，其中包含了作者一些自己的经验，里面的实验也基本全在WIN 2K和ORACLE 8.1.6环境下测
Mootools 1.2教程(3)——数组使用简介
数组使用简介原文地址：30 Days of Mootools 1.2 Tutorials - Day 3 - Intro to Using
asp 去除最后一个逗号为空字符串的代码
asp中怎么替换最后一个逗号为空字符串？举例 aaa,bbb,ccc,eee, 这个字符串怎么让最后一个逗号变没，其他的不变啊？问题补充：
Debugging JavaScript：throw与console
我想没多少人敢保证写JavaScript能不用调试，那选择用什么方式调试会比较好呢？告别了我最爱的alert("MM")
asp如何对欲删除的记录确认后再删除？
看看这个指令在ASP程序中的应用，有[delete from 歌手 where 艺名='cs2000']，删除艺名为cs20

简单的文本内容处理工具

有关JS中Event对象的几点总结

利用sort()和Math.random()实现元素的随机排列

如何编写高质量的Javascript代码

js和asp操作fso比较

优化次数过多的循环

随机显示图片

Js实现仿msn的右下角popup提示窗口

HTML在线编辑器的原理分析（整理）

仿china.nba.com焦点图轮播展示效果(ie6,ff)

FTP服务器架设考虑三方面的安全因素

有关缓存 Cache 的随想

网页广告 Banner 设计图文手册

mysql UNIX时间戳与日期的相互转换

中国宽带用户超过美国居世界首位达到7160万

ASP生成静态页面的方法

如何寻找适合自己的盈利方式

javascript阻止事件冒泡和浏览器的默认行为

新手站长要眼光放远学会利用而不是依赖

做资料类网站的心得

手机版 网络编程 asp之家 www.aspxhome.com