定单管理上 JS表格排序第2/2页

更新时间：2006年10月26日 00:00:00 作者：

客户需要一个这样的效果单击一个图片显示隐藏的5个导航图片
就是差图片渐隐渐显的效果感觉太生硬大家帮忙看看改改谢谢代码如下

<!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=gb2312" /> <title>顺序显示</title> <style type="text/css"> #container{     position:absolute;     padding:10px; } #container li{     display:none;     list-style:none;     float:left;     margin:5px;     padding:2px;     width:80px;     height:80px;     border:3px #ccc double;     font:30px Verdana, Arial, Helvetica, sans-serif;     color:#666;     background-color: #eee;     FILTER: alpha(opacity=50); } #container .orderly-change{     border:3px #666 double;         FILTER: alpha(opacity=100); } </style> </head> <body> <a href="#" onclick="orderly_show()"><img src="http://image2.sina.com.cn/dy/temp/119/2006-02-05/U1043P1T119D48F2656DT20061025113622.jpg"  border="0" /></a> <-------点一下这张图片 <ul id="container" >   <li id="li1"><img src="http://image2.sina.com.cn/dy/z/chinaafrica/U43P1T63D2742F1244DT20061019181804.jpg" /></li>   <li id="li2"><img src="http://image2.sina.com.cn/dy/z/chinaafrica/U43P1T63D2742F1215DT20061019181804.jpg" /></li>   <li id="li3"><img src="http://image2.sina.com.cn/dy/z/chinaafrica/U43P1T63D2742F1250DT20061019180903.jpg" /></li>   <li id="li4"><img src="http://image2.sina.com.cn/dy/z/chinaafrica/U43P1T63D2742F1244DT20061019181804.jpg" /></li>   <li id="li5"><img src="http://image2.sina.com.cn/dy/z/chinaafrica/U43P1T63D2742F1249DT20061019180903.jpg" /></li>   <li id="li6"><img src="http://image2.sina.com.cn/dy/z/chinaafrica/U43P1T63D2742F1249DT20061019181804.jpg" /></li> </ul> <script type="text/javascript"> var i=0,j function orderly_show(){     var container_li=document.getElementById("container").getElementsByTagName("li");     if(i<container_li.length){         container_li[i].style.display="block";         if(j<container_li.length){             container_li[j].className="orderly-change";         }         i++;         j=i-1;     }     else if(i=container_li.length){         container_li[j].className="orderly-change";     }     setTimeout("orderly_show()",900); } //orderly_show(); </script> </body> </html>

[Ctrl+A 全选注:引入外部Js需再刷新一下页面才能执行]

上一页 12阅读全文

您可能感兴趣的文章:

借助JavaScript脚本判断浏览器Flash Player信息的方法
做了一个小的Demo，在测试时发现经常报错，对此总结了一下借助JavaScript脚本判断浏览器Flash Player信息的方法,需要的朋友可以参考下
2014-07-07
使用重写url机制实现验证码换一张功能
重写URL机制：为了保证一个url的地址唯一，可每次向服务器传递的参数不一样即可。此处在实现验证码的换一张的功能时，就是利用了改变参数列表的值进行刷新。具体详细代码大家参考下本文
2017-08-08
详解JavaScript实现JS弹窗的三种方式
这篇文章主要为大家介绍了JavaScript实现JS弹窗的三种方式，具有一定的参考价值，感兴趣的小伙伴们可以参考一下，希望能够给你带来帮助<BR>
2022-01-01
javascript中setTimeout使用指南
本文给大家通过3个方法向大家展示了javascript中的setTimeout的使用，非常的简单，有需要的小伙伴可以参考下。
2015-07-07
不使用jquery实现js打字效果示例分享
js打字效果示例js打字效果示例,data-period设置从打字返回删字的时间，data-rotate可加减中英文词语，不用jquery支持
2014-01-01
JS 自定义带默认值的函数
今天与同事一起看了一个javscript定义函数问题，如何在定义一个函数里给参数一个默认值.
2011-07-07
基于Three.js插件制作360度全景图
这篇文章主要介绍了基于Three.js插件制作的360度全景图,代码简单易懂，非常不错，具有参考借鉴价值，需要的朋友可以参考下
2016-11-11
js实现简洁的TAB滑动门效果代码
这篇文章主要介绍了js实现简洁的TAB滑动门效果代码,通过简单的JavaScript自定义函数动态遍历页面元素实现tab滑动切换的功能,具有一定参考借鉴价值,需要的朋友可以参考下
2015-09-09
JS+HTML5 FileReader实现文件上传前本地预览功能
这篇文章主要为大家详细介绍了JS+HTML5 FileReader实现文件上传前本地预览功能，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
2017-07-07
JavaScript中style.left与offsetLeft的使用及区别详解
这篇文章主要介绍了JavaScript中style.left与offsetLeft的使用及区别详解的相关资料,非常不错具有参考借鉴价值，需要的朋友可以参考下
2016-06-06

定单管理上 JS表格排序第2/2页

相关文章

最新评论

大家感兴趣的内容

最近更新的内容

常用在线小工具