<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="zh-CN" lang="zh-CN">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<meta http-equiv="content-language" content="zh-cn" />
<meta http-equiv="imagetoolbar" content="false" />
<meta name="generator" content="EditPlus Text Editor v3.01(446)" />
<meta name="keywords" content="" />
<meta name="description" content="" />
<meta name="author" content="solar" />
<meta name="robots" content="all" />
<title>首页标签切换</title>
<link rel="shortcut icon" href="favicon.ico" type="image/x-icon" />
<link rel="copyright" href="legal.html" />
<link rel="stylesheet" type="text/css" href="style.css" charset="utf-8" media="screen" />
<script type="text/javascript">
/*
Tab构造函数
SubShowClass(ID[,eventType][,defaultID][,openClassName][,closeClassName])
*/
function SubShowClass(ID,eventType,defaultID,openClassName,closeClassName){this.version="1.0";this.author="mengjia";this.parentObj=SubShowClass.$ (ID);if(this.parentObj==null){throw new Error("SubShowClass(ID)参数错误:ID 对像存在!")};if(!SubShowClass.childs){SubShowClass.childs=[]};this.ID=SubShowClass.childs.length;SubShowClass.childs.push(this);this.lock=false;this.label=[];this.defaultID=defaultID==null?0:defaultID;this.selectedIndex=this.defaultID;this.openClassName=openClassName==null?"selected":openClassName;this.closeClassName=closeClassName==null?"":closeClassName;this.mouseIn=false;var mouseInFunc=Function("SubShowClass.childs["+this.ID+"].mouseIn = true"),mouseOutFunc=Function("SubShowClass.childs["+this.ID+"].mouseIn = false");if(this.parentObj.attachEvent){this.parentObj.attachEvent("onmouseover",mouseInFunc)}else{this.parentObj.addEventListener("mouseover",mouseInFunc,false)};if(this.parentObj.attachEvent){this.parentObj.attachEvent("onmouseout",mouseOutFunc)}else{this.parentObj.addEventListener("mouseout",mouseOutFunc,false)};if(typeof(eventType)!="string"){eventType="onmousedown"};eventType=eventType.toLowerCase();switch(eventType){case "onmouseover":this.eventType="mouseover";break;case "onmouseout":this.eventType="mouseout";break;case "onclick":this.eventType="click";break;case "onmouseup":this.eventType="mouseup";break;default:this.eventType="mousedown"};this.addLabel=function(labelID,contID,parentBg,springEvent,blurEvent){if(SubShowClass.$ (labelID)==null){throw new Error("addLabel(labelID)参数错误:labelID 对像存在!")};var TempID=this.label.length;if(parentBg==""){parentBg=null};this.label.push([labelID,contID,parentBg,springEvent,blurEvent]);var tempFunc=Function('SubShowClass.childs['+this.ID+'].select('+TempID+')');if(SubShowClass.$ (labelID).attachEvent){SubShowClass.$ (labelID).attachEvent("on"+this.eventType,tempFunc)}else{SubShowClass.$ (labelID).addEventListener(this.eventType,tempFunc,false)};if(TempID==this.defaultID){SubShowClass.$ (labelID).className=this.openClassName;if(SubShowClass.$ (contID)){SubShowClass.$ (contID).style.display=""};if(parentBg!=null){this.parentObj.style.background=parentBg};if(springEvent!=null){eval(springEvent)}}else{SubShowClass.$ (labelID).className=this.closeClassName;if(SubShowClass.$ (contID)){SubShowClass.$ (contID).style.display="none"}};if(SubShowClass.$ (contID)){if(SubShowClass.$ (contID).attachEvent){SubShowClass.$ (contID).attachEvent("onmouseover",mouseInFunc)}else{SubShowClass.$ (contID).addEventListener("mouseover",mouseInFunc,false)};if(SubShowClass.$ (contID).attachEvent){SubShowClass.$ (contID).attachEvent("onmouseout",mouseOutFunc)}else{SubShowClass.$ (contID).addEventListener("mouseout",mouseOutFunc,false)}}};this.select=function(num,force){if(typeof(num)!="number"){throw new Error("select(num)参数错误:num 不是 number 类型!")};if(force!=true&&this.selectedIndex==num){return};var i;for(i=0;i<this.label.length;i++){if(i==num){SubShowClass.$ (this.label[i][0]).className=this.openClassName;if(SubShowClass.$ (this.label[i][1])){SubShowClass.$ (this.label[i][1]).style.display=""};if(this.label[i][2]!=null){this.parentObj.style.background=this.label[i][2]};if(this.label[i][3]!=null){eval(this.label[i][3])}}else if(this.selectedIndex==i||force==true){SubShowClass.$ (this.label[i][0]).className=this.closeClassName;if(SubShowClass.$ (this.label[i][1])){SubShowClass.$ (this.label[i][1]).style.display="none"};if(this.label[i][4]!=null){eval(this.label[i][4])}}};this.selectedIndex=num};this.random=function(){if(arguments.length!=this.label.length){throw new Error("random()参数错误:参数数量与标签数量不符!")};var sum=0,i;for(i=0;i<arguments.length;i++){sum+=arguments[i]};var randomNum=Math.random(),percent=0;for(i=0;i<arguments.length;i++){percent+=arguments[i]/sum;if(randomNum<percent){this.select(i);break}}};this.autoPlay=false;var autoPlayTimeObj=null;this.spaceTime=5000;this.play=function(spTime){if(typeof(spTime)=="number"){this.spaceTime=spTime};clearInterval(autoPlayTimeObj);autoPlayTimeObj=setInterval("SubShowClass.childs["+this.ID+"].nextLabel()",this.spaceTime);this.autoPlay=true};this.nextLabel=function(){if(this.autoPlay==false||this.mouseIn==true){return};var index=this.selectedIndex;index++;if(index>=this.label.length){index=0};this.select(index)};this.stop=function(){clearInterval(autoPlayTimeObj);this.autoPlay=false}};SubShowClass.$ =function(objName){if(document.getElementById){return eval('document.getElementById("'+objName+'")')}else{return eval('document.all.'+objName)}}
</script>
<style type="text/css">
<!--
/* CSS mengjia 080218 */
body,html{margin:0 auto;padding:0; background:#fff}
.wrap {border:1px solid #ccc; padding:8px; margin:20px auto;width:500px}
.blk_12 {border:1px solid #ccc; padding:8px;margin-bottom:8px}
/* Tab */
.T_Menu{background:#fff;border:1px solid #ccc; border-bottom:0;height:25px;color:#021a74;}
.T_Menu label{background:#f0f0f0;font-size:14px;text-align:center;line-height:25px;padding:0px 8px;border-right:1px solid #ccc;cursor:pointer;float:left;}
.T_Menu label.selected{color:#C00;background:#fafbff;}
-->
</style>
</head>
<body>
<div class="wrap">
<div class="T_Menu" id="SubShow_01">
<label class="selected" id="S_Label_01_01">测试1</label>
<label id="S_Label_01_02">测试2</label>
</div>
<div class="blk_12" id="S_Cont_01_01">
<h1>01</h1>
</div>
<div class="blk_12" id="S_Cont_01_02" style="display:none">
<h1>02</h1>
</div>
<script type="text/javascript">
<!--//--><![CDATA[//><!--
var SubShow_01 = new SubShowClass("SubShow_01","onmouseover",0,"selected","");
for(var i=1;i<=2;i++){
SubShow_01.addLabel("S_Label_01_0"+i,"S_Cont_01_0"+i,"","","");
}
//--><!]]>
</script>
<div class="T_Menu" id="SubShow_02">
<label class="selected" id="S_Label_02_01">测试4</label>
<label id="S_Label_02_02">测试5</label>
<label id="S_Label_02_03">测试6</label>
</div>
<div class="blk_12" id="S_Cont_02_01">
<h1>04</h1>
</div>
<div class="blk_12" id="S_Cont_02_02" style="display:none">
<h1>05</h1>
</div>
<div class="blk_12" id="S_Cont_02_03" style="display:none">
<h1>06</h1>
</div>
<script type="text/javascript">
<!--//--><![CDATA[//><!--
var SubShow_02 = new SubShowClass("SubShow_02","onmouseover",0,"selected","");
for(var i=1;i<=3;i++){
SubShow_02.addLabel("S_Label_02_0"+i,"S_Cont_02_0"+i,"","","");
}
//--><!]]>
</script>
<div class="T_Menu" id="SubShow_03">
<label class="selected" id="S_Label_03_01">测试7</label>
<label id="S_Label_03_02">测试8</label>
</div>
<div class="blk_12" id="S_Cont_03_01">
<h1>07</h1>
</div>
<div class="blk_12" id="S_Cont_03_02" style="display:none">
<h1>08</h1>
</div>
<script type="text/javascript">
<!--//--><![CDATA[//><!--
var SubShow_03 = new SubShowClass("SubShow_03","onmouseover",0,"selected","");
for(var i=1;i<=2;i++){
SubShow_03.addLabel("S_Label_03_0"+i,"S_Cont_03_0"+i,"","","");
}
//--><!]]>
</script>
</div>
</body>
</html>
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="zh-CN" lang="zh-CN">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<meta http-equiv="content-language" content="zh-cn" />
<meta http-equiv="imagetoolbar" content="false" />
<meta name="generator" content="EditPlus Text Editor v3.01(446)" />
<meta name="keywords" content="" />
<meta name="description" content="" />
<meta name="author" content="solar" />
<meta name="robots" content="all" />
<title>首页标签切换</title>
<link rel="shortcut icon" href="favicon.ico" type="image/x-icon" />
<link rel="copyright" href="legal.html" />
<link rel="stylesheet" type="text/css" href="style.css" charset="utf-8" media="screen" />
<script type="text/javascript">
/*
Tab构造函数
SubShowClass(ID[,eventType][,defaultID][,openClassName][,closeClassName])
*/
function SubShowClass(ID,eventType,defaultID,openClassName,closeClassName){this.version="1.0";this.author="mengjia";this.parentObj=SubShowClass.$ (ID);if(this.parentObj==null){throw new Error("SubShowClass(ID)参数错误:ID 对像存在!")};if(!SubShowClass.childs){SubShowClass.childs=[]};this.ID=SubShowClass.childs.length;SubShowClass.childs.push(this);this.lock=false;this.label=[];this.defaultID=defaultID==null?0:defaultID;this.selectedIndex=this.defaultID;this.openClassName=openClassName==null?"selected":openClassName;this.closeClassName=closeClassName==null?"":closeClassName;this.mouseIn=false;var mouseInFunc=Function("SubShowClass.childs["+this.ID+"].mouseIn = true"),mouseOutFunc=Function("SubShowClass.childs["+this.ID+"].mouseIn = false");if(this.parentObj.attachEvent){this.parentObj.attachEvent("onmouseover",mouseInFunc)}else{this.parentObj.addEventListener("mouseover",mouseInFunc,false)};if(this.parentObj.attachEvent){this.parentObj.attachEvent("onmouseout",mouseOutFunc)}else{this.parentObj.addEventListener("mouseout",mouseOutFunc,false)};if(typeof(eventType)!="string"){eventType="onmousedown"};eventType=eventType.toLowerCase();switch(eventType){case "onmouseover":this.eventType="mouseover";break;case "onmouseout":this.eventType="mouseout";break;case "onclick":this.eventType="click";break;case "onmouseup":this.eventType="mouseup";break;default:this.eventType="mousedown"};this.addLabel=function(labelID,contID,parentBg,springEvent,blurEvent){if(SubShowClass.$ (labelID)==null){throw new Error("addLabel(labelID)参数错误:labelID 对像存在!")};var TempID=this.label.length;if(parentBg==""){parentBg=null};this.label.push([labelID,contID,parentBg,springEvent,blurEvent]);var tempFunc=Function('SubShowClass.childs['+this.ID+'].select('+TempID+')');if(SubShowClass.$ (labelID).attachEvent){SubShowClass.$ (labelID).attachEvent("on"+this.eventType,tempFunc)}else{SubShowClass.$ (labelID).addEventListener(this.eventType,tempFunc,false)};if(TempID==this.defaultID){SubShowClass.$ (labelID).className=this.openClassName;if(SubShowClass.$ (contID)){SubShowClass.$ (contID).style.display=""};if(parentBg!=null){this.parentObj.style.background=parentBg};if(springEvent!=null){eval(springEvent)}}else{SubShowClass.$ (labelID).className=this.closeClassName;if(SubShowClass.$ (contID)){SubShowClass.$ (contID).style.display="none"}};if(SubShowClass.$ (contID)){if(SubShowClass.$ (contID).attachEvent){SubShowClass.$ (contID).attachEvent("onmouseover",mouseInFunc)}else{SubShowClass.$ (contID).addEventListener("mouseover",mouseInFunc,false)};if(SubShowClass.$ (contID).attachEvent){SubShowClass.$ (contID).attachEvent("onmouseout",mouseOutFunc)}else{SubShowClass.$ (contID).addEventListener("mouseout",mouseOutFunc,false)}}};this.select=function(num,force){if(typeof(num)!="number"){throw new Error("select(num)参数错误:num 不是 number 类型!")};if(force!=true&&this.selectedIndex==num){return};var i;for(i=0;i<this.label.length;i++){if(i==num){SubShowClass.$ (this.label[i][0]).className=this.openClassName;if(SubShowClass.$ (this.label[i][1])){SubShowClass.$ (this.label[i][1]).style.display=""};if(this.label[i][2]!=null){this.parentObj.style.background=this.label[i][2]};if(this.label[i][3]!=null){eval(this.label[i][3])}}else if(this.selectedIndex==i||force==true){SubShowClass.$ (this.label[i][0]).className=this.closeClassName;if(SubShowClass.$ (this.label[i][1])){SubShowClass.$ (this.label[i][1]).style.display="none"};if(this.label[i][4]!=null){eval(this.label[i][4])}}};this.selectedIndex=num};this.random=function(){if(arguments.length!=this.label.length){throw new Error("random()参数错误:参数数量与标签数量不符!")};var sum=0,i;for(i=0;i<arguments.length;i++){sum+=arguments[i]};var randomNum=Math.random(),percent=0;for(i=0;i<arguments.length;i++){percent+=arguments[i]/sum;if(randomNum<percent){this.select(i);break}}};this.autoPlay=false;var autoPlayTimeObj=null;this.spaceTime=5000;this.play=function(spTime){if(typeof(spTime)=="number"){this.spaceTime=spTime};clearInterval(autoPlayTimeObj);autoPlayTimeObj=setInterval("SubShowClass.childs["+this.ID+"].nextLabel()",this.spaceTime);this.autoPlay=true};this.nextLabel=function(){if(this.autoPlay==false||this.mouseIn==true){return};var index=this.selectedIndex;index++;if(index>=this.label.length){index=0};this.select(index)};this.stop=function(){clearInterval(autoPlayTimeObj);this.autoPlay=false}};SubShowClass.$ =function(objName){if(document.getElementById){return eval('document.getElementById("'+objName+'")')}else{return eval('document.all.'+objName)}}
</script>
<style type="text/css">
<!--
/* CSS mengjia 080218 */
body,html{margin:0 auto;padding:0; background:#fff}
.wrap {border:1px solid #ccc; padding:8px; margin:20px auto;width:500px}
.blk_12 {border:1px solid #ccc; padding:8px;margin-bottom:8px}
/* Tab */
.T_Menu{background:#fff;border:1px solid #ccc; border-bottom:0;height:25px;color:#021a74;}
.T_Menu label{background:#f0f0f0;font-size:14px;text-align:center;line-height:25px;padding:0px 8px;border-right:1px solid #ccc;cursor:pointer;float:left;}
.T_Menu label.selected{color:#C00;background:#fafbff;}
-->
</style>
</head>
<body>
<div class="wrap">
<div class="T_Menu" id="SubShow_01">
<label class="selected" id="S_Label_01_01">测试1</label>
<label id="S_Label_01_02">测试2</label>
</div>
<div class="blk_12" id="S_Cont_01_01">
<h1>01</h1>
</div>
<div class="blk_12" id="S_Cont_01_02" style="display:none">
<h1>02</h1>
</div>
<script type="text/javascript">
<!--//--><![CDATA[//><!--
var SubShow_01 = new SubShowClass("SubShow_01","onmouseover",0,"selected","");
for(var i=1;i<=2;i++){
SubShow_01.addLabel("S_Label_01_0"+i,"S_Cont_01_0"+i,"","","");
}
//--><!]]>
</script>
<div class="T_Menu" id="SubShow_02">
<label class="selected" id="S_Label_02_01">测试4</label>
<label id="S_Label_02_02">测试5</label>
<label id="S_Label_02_03">测试6</label>
</div>
<div class="blk_12" id="S_Cont_02_01">
<h1>04</h1>
</div>
<div class="blk_12" id="S_Cont_02_02" style="display:none">
<h1>05</h1>
</div>
<div class="blk_12" id="S_Cont_02_03" style="display:none">
<h1>06</h1>
</div>
<script type="text/javascript">
<!--//--><![CDATA[//><!--
var SubShow_02 = new SubShowClass("SubShow_02","onmouseover",0,"selected","");
for(var i=1;i<=3;i++){
SubShow_02.addLabel("S_Label_02_0"+i,"S_Cont_02_0"+i,"","","");
}
//--><!]]>
</script>
<div class="T_Menu" id="SubShow_03">
<label class="selected" id="S_Label_03_01">测试7</label>
<label id="S_Label_03_02">测试8</label>
</div>
<div class="blk_12" id="S_Cont_03_01">
<h1>07</h1>
</div>
<div class="blk_12" id="S_Cont_03_02" style="display:none">
<h1>08</h1>
</div>
<script type="text/javascript">
<!--//--><![CDATA[//><!--
var SubShow_03 = new SubShowClass("SubShow_03","onmouseover",0,"selected","");
for(var i=1;i<=2;i++){
SubShow_03.addLabel("S_Label_03_0"+i,"S_Cont_03_0"+i,"","","");
}
//--><!]]>
</script>
</div>
</body>
</html>
回复Comments
作者:
{commentrecontent}