We Are Hugo & Jessie's Family
Javascript
去除点击链接出现的虚线框
三 10th
在页面上点击链接常出现虚线框…有时候觉得多少有些碍眼（实际上它也是有用滴，提示当前焦点—-随便啥页面按Tab键瞧瞧…虚线框看见了吧~这作用可不小吧^_^），但是，某些时候页面总体美观性会被链接的这一属性给妨碍。那么~有办法去掉它么？当然….是有办法滴~目前的解决办法有以下两种：【第1种方法】IE 下可使用其私有的html属性“hideFoucs”在标签的结构中加入 hidefocus=”true” 属性。即：<a href="http://www.teanie.com" hidefocus="true" title="欢迎光临时间线">时间线</a>而在 Firfox 浏览器中则相对比较容易，直接给标签 a 定义样式 outline:none; 就可以了，即：.HideFocus {outline:none;}【第2种方法】也可以仅用 CSS 来控制，即对 IE 的情形使用 expression 表达式，但不推荐使用，毕竟 expression 在性能上有问题。.HideFocus { hide-focus: expression(this.hideFocus=true); /* for ie 5+ */ outline: none; /* for firefox 1.5 + */}除链接外，该 CSS 同样适用于 input 和 button 标签。注：IE6, IE7, FF1.5, FF2, Opera9 测试通过。（opera9 似乎默认就不显示焦点虚线框哈）
javascript 目前颇为流行的图片切换效果（天极网首页）
十一 1st
HTML代码
var widths=282;
var heights=164;
var counts=6;
img1=new Image ();img1.src='http://www.yesky.com/imagesnew/software/zhuanti/vista/282x164.jpg';
img2=new Image ();img2.src='http://www.yesky.com/imagelist/2007/309/3j6qk84kib65.jpg';
img3=new Image ();img3.src='UploadFile/jscode/2007729214814549.jpg';
img4=new Image ();img4.src='UploadFile/jscode/2007729214814651.jpg';
img5=new Image ();img5.src='UploadFile/jscode/2007729214815914.jpg';
img6=new Image ();img6.src='UploadFile/jscode/2007729214816449.jpg';
url1=new Image ();url1.src='http://www.teanie.com';
url2=new Image ();url2.src='http://www.teanie.com';
url3=new Image ();url3.src='http://www.teanie.com';
url4=new Image ();url4.src='http://www.teanie.com';
url5=new Image ();url5.src='http://www.teanie.com';
url6=new Image ();url6.src='http://www.teanie.com';
//天极伊永恒原创
var nn=1;
var key=0;
function change_img()
{if(key==0){key=1;}
else if(document.all)
{document.getElementById("pic").filters[0].Apply();document.getElementById("pic").filters[0].Play(duration=2);}
eval('document.getElementById("pic").src=img'+nn+'.src');
eval('document.getElementById("url").href=url'+nn+'.src');
for (var i=1;icounts){nn=1;}
tt=setTimeout('change_img()',4000);}
function changeimg(n){nn=n;window.clearInterval(tt);change_img();}
document.write('
');
document.write('.axx{padding:1px 7px;border-left:#cccccc 1px solid;}');
document.write('a.axx:link,a.axx:visited{text-decoration:none;color:#fff;line-height:12px;font:9px sans-serif;background-color:#666;}');
document.write('a.axx:active,a.axx:hover{text-decoration:none;color:#fff;line-height:12px;font:9px sans-serif;background-color:#999;}');
document.write('.bxx{padding:1px 7px;border-left:#cccccc 1px solid;}');
document.write('a.bxx:link,a.bxx:visited{text-decoration:none;color:#fff;line-height:12px;font:9px sans-serif;background-color:#D34600;}');
document.write('a.bxx:active,a.bxx:hover{text-decoration:none;color:#fff;line-height:12px;font:9px sans-serif;background-color:#D34600;}');
document.write('
'); document.write(' '); document.write('
'); document.write(' '); for(var i=1;i
Tab 切换菜单
十一 1st
HTML代码
.menu_title2{background:red;}
.menu_title1{background:green;}
.box{width:400px;padding:10px;}
.hd{float:left;}
.hd a{clear:both;font-size:13px;text-decoration:none;padding:6px 20px;display:block;color:white;}
.hd a:hover{background:red;}
.bd{float:left;}
.bd div{width:200px;height:300px;background:#eee;border:1px solid #ccc;margin:0 6px;}
var tID=0; function ShowTabs(ID){ if(ID!=tID){ eval("document.getElementById('TabTitle"+[tID]+"').className='menu_title1';"); eval("document.getElementById('TabTitle"+[ID]+"').className='menu_title2';"); eval("document.getElementById('Tabs"+[tID]+"').style.display='none';"); eval("document.getElementById('Tabs"+[ID]+"').style.display='';"); tID=ID; } }
菜单11 菜单22 菜单33 菜单44 菜单55 菜单66111 222 333 444 555 666
[Ctrl+A 全部选择 提示：你可先修改部分代码，再按运行]
无限级联菜单 – javascript
六 24th
琥珀无限级联菜单…javascript版的，收藏列～===================================<html> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312"> <title>琥珀网 – javascript无限级联动菜单</title> <style type="text/css"> body, td { font-family: 宋体; font-size: 12px; } </style><script language="javascript">/*—————————————————————————*\| Subject: JavaScript三级联动菜单 || Version: 1.0 || Author: 琥珀【hopesoft】 || FileName: HPMenu.js || Created: 2005-10-16 || LastModified: 2005-10-16 || Download: http://www.10090.com/Demo/hpmenu/HPMenu.rar || Explain: http://www.10090.com/Demo/ || Demo: http://www.10090.com/Demo/ || || You may use this code on your item || this entire copyright notice appears unchanged || and you clearly display a link to http://www.10090.com/ || ||—————————————————————————–|| MSN: hopesoft@msn.com QQ: 11318729 http://www.10090.com || Copyright (c) 2004-2005 HopeSoftStudio |\*—————————————————————————*/function Menu(theform,menuid) {/*—————————————————————————*\* 1.变量定义 */*—————————————————————————*/ //定义菜单级别MenuClass,菜单长度数组MenuLenArr,//菜单名称数组MenuArr,下级菜单数组SubMenuArr，菜单ID数组MenuIdArrvar MenuClass,MenuLenArr,MenuArr,SubMenuArr,MenuIdArr//定义分隔符：splitchar1,splitchar2var splitchar1,splitchar2//定义临时数组,子数组,数组长度,var arr,subarr,arrlen/*—————————————————————————*\* 2.变量赋值 */*—————————————————————————*/MenuArr=new Array()MenuLenArr=new Array()SubMenuArr=new Array()MenuIdArr=new Array()MenuArr[1]="欧洲|||亚洲|||非洲|||大洋洲|||北美洲|||南美洲" //洲名|||…MenuArr[2]="欧洲###德国|||欧洲###法国|||北美洲###美国|||北美洲###加拿大|||亚洲###中国|||非洲###埃及|||大洋洲###澳大利亚|||南美洲###墨西哥" //洲名###国名|||…MenuArr[3]="中国###北京|||中国###上海|||美国###华盛顿|||美国###纽约|||德国###柏林|||法国###巴黎|||加拿大###多伦多|||埃及###开罗|||澳大利亚###悉尼|||墨西哥###墨西哥城" //国名###城市名|||…MenuArr[4]="北京###朝阳区|||上海###徐汇区|||广州###天河区|||纽约###曼哈顿区|||华盛顿###华盛顿区|||柏林###新柏林区|||巴黎###大巴黎区|||开罗###大开罗|||悉尼###悉尼市区|||墨西哥城###墨西哥城区" //国名###城市名|||…MenuIdArr[1]="zhou"MenuIdArr[2]="guo"MenuIdArr[3]="shi"MenuIdArr[4]="qu"MenuClass=4 //4级菜单splitchar1="|||";splitchar2="###";/*—————————————————————————*\* 3.生成数组 */*—————————————————————————*/for(iii=1;iii<=MenuClass;iii++){arr=MenuArr[iii].split(splitchar1);len=arr.length;subarr=new Array()for (i=0;i<len;i++){ subarr[i]=arr[i].split(splitchar2);}len=subarr.length;SubMenuArr[iii]=subarr MenuLenArr[iii]=len}//============更改下级菜单======================var self,submenu,thislen,thisarr //self本级菜单//submenu子菜单//theform:所在表单对象[type:object]//menuid:本级菜单级别ID，如1级菜单则为1 self=eval("document."+theform.name+"."+MenuIdArr[menuid]) submenu=eval("document."+theform.name+"."+MenuIdArr[menuid+1]) thislen=MenuLenArr[menuid+1] thisarr=SubMenuArr[menuid+1] submenu.length=0 submenu.options.add(new Option( "—–请选择—–","")); for (i=0;i<thislen;i++) { if (thisarr[i][0] == self.value) { submenu.options.add(new Option(thisarr[i][1], thisarr[i][1])); } } submenu.options[0].selected=true//============更改下级以下菜单==============var kkkfor(kkk=menuid+2;kkk<=MenuClass;kkk++) { submenu=eval("document."+theform.name+"."+MenuIdArr[kkk]) submenu.length=0 submenu.options.add(new Option( "—–请选择—–","")); submenu.options[0].selected=true }}</script> <form name="form1" method="post" action=""> <table width="90%" border="0" align="center" cellpadding="2" cellspacing="1" bgcolor="#CCCCCC"> <tr bgcolor="F1F1F1"> <td height="24" colspan="2" align="center">琥珀无限级联动菜单-JavaScript版 [HPMenu V1.0]</td> </tr> <tr bgcolor="#FFFFFF"> <td width="12%" height="24" align="center">所 在 洲:</td> <td><select name="zhou" id="zhou" onChange="Menu(this.form,1);"> <option value="" selected>—–请选择—–</option> <option value='欧洲'>欧洲</option> <option value='亚洲'>亚洲</option> <option value='非洲'>非洲</option> <option value='大洋洲'>大洋洲</option> <option value='北美洲'>北美洲</option> <option value='南美洲'>南美洲</option> </select></td> </tr> <tr bgcolor="#FFFFFF"> <td height="24" align="center">国 家:</td> <td><select name="guo" id="select" onChange="Menu(this.form,2);"> <option value="" selected>—–请选择—–</option> </select></td> </tr> <tr bgcolor="#FFFFFF"> <td height="24" align="center">城 市:</td> <td><select name="shi" id="select2" onChange="Menu(this.form,3);"> <option value="" 更多 >
