本站域名:www.lmpx.net 现在时刻:
 
-您现在的位置:首页>>网页特效
特效名称:页面左侧导航条
实现此效果你需要进行如下 2 步操作: [查看演示效果]
1步:将以下代码加到〈head〉与〈/head〉之间
<style type="text/css">
<!--

a{text-decoration:none;color:#000000;font-size:8pt;font-family:verdana}
//-->
</style>

2步:将以下代码加到〈body〉与〈/body〉之间

<script language="JavaScript">
<!--

var top=50;

var left=0;

var bordercolor="#000000";

var bgcolorLight="#EFEFEF";

var bgcolorDark="#DFDFDF";


um1 = new Array("Menu1",
"Link1_um1", "http:///",
"Link2_um1", "http:///",
"Link3_um1", "http:///",
"Link4_um1", "http:///",
"Link5_um1", "http:///",
"Link6_um1", "http:///")

um2 = new Array("Menu2",
"Link1_um2", "http:///",
"Link2_um2", "http:///",
"Link3_um2", "http:///",
"Link4_um2", "http:///")

um3 = new Array("Menu3",
"Link1_um3", "http:///",
"Link2_um3", "http:///",
"Link3_um3", "http:///",
"Link4_um3", "http:///",
"Link5_um3", "http:///",
"Link6_um3", "http:///",
"Link7_um3", "http:///",
"Link8_um3", "http:///",
"Link9_um3", "http:///",
"Link10_um3", "http:///",
"Link11_um3", "http:///",
"Link12_um3", "http:///",
"Link13_um3", "http:///",
"Link14_um3", "http:///",
"Link15_um3", "http:///")
//-->
</script>
<script language="JavaScript">
<!-- 

function checkBrowser(){ 
this.ver=navigator.appVersion 
this.dom=document.getElementById?1:0 
this.ie6=(this.ver.indexOf("MSIE 6")>-1 && this.dom)?1:0; 
this.ie5=(this.ver.indexOf("MSIE 5")>-1 && this.dom)?1:0; 
this.ie4=(document.all && !this.dom)?1:0; 
this.ns5=(this.dom && parseInt(this.ver) >= 5) ?1:0; 
this.ns4=(document.layers && !this.dom)?1:0; 
this.mac=(this.ver.indexOf('Mac') > -1) ?1:0; 
this.ope=(navigator.userAgent.indexOf('Opera')>-1); 
this.ie=(this.ie6 || this.ie5 || this.ie4) 
this.ns=(this.ns4 || this.ns5) 
this.bw=(this.ie6 || this.ie5 || this.ie4 || this.ns5 || this.ns4 || this.mac || this.ope) 
this.nbw=(!this.bw) 
return this} 
bw=new checkBrowser() 

var um1length = ((um1.length-1)/2); 
var um2length = ((um2.length-1)/2); 
var um3length = ((um3.length-1)/2); 

var um1nr = 0; 
var um1nr2 = 1; 
var um1nr3 = 2; 
var um2nr = 0; 
var um2nr2 = 1; 
var um2nr3 = 2; 
var um3nr = 0; 
var um3nr2 = 1; 
var um3nr3 = 2; 

init(); 

function init() 

if(bw.ie6 || bw.ie4 || bw.ie5){ 
height=document.body.offsetHeight-4; 
document.write('<div id="menubg" style="position:absolute;top:0;left:'+left+';background-color:'+bgcolorLight+';border-style:solid;border-width:1px;border-color:'+bordercolor+';width:127;height:'+height+';border-top-width:0px">') 
document.write('</div>') 
document.write('<div id="m" style="position:absolute;top:'+top+';left:'+left+'">') 
document.write('<div style="background-color:'+bgcolorDark+';border-style:solid;border-width:1px;border-color:'+bordercolor+';width:127">') 
document.write('<table align="center">') 
document.write('<tr><td align="center"><a href="javascript:do_m1_ie()">'+um1[0]+'</a></td></tr>') 
document.write('</table>') 
document.write('</div>') 
document.write('<div id="um1" style="position:absolute;top:20;left:0;background-color:'+bgcolorLight+';border-style:solid;border-width:1px;border-color:'+bordercolor+';width:127;border-bottom-width:0px">') 
document.write('<table align="center">'); 

else if(bw.ns4){ 
height=innerHeight; 
document.write('<layer id="menubg" position="absolute" top="0" left="'+left+'" bgcolor="'+bordercolor+'" width="127" height="'+(height)+'">') 
document.write('</layer>') 
document.write('<layer id="menubg2" position="absolute" top="0" left="'+(left+1)+'" bgcolor="'+bgcolorLight+'" width="125" height="'+(height-1)+'">') 
document.write('</layer>') 
document.write('<layer id="m" position="absolute" top="50" left="'+(left+1)+'">') 
document.write('<layer bgcolor="'+bordercolor+'" width="125">') 
document.write('<table align="center">') 
document.write('<tr><td align="center"></td></tr>') 
document.write('</table>') 
document.write('</layer>') 
document.write('<layer bgcolor="'+bgcolorDark+'" width="125" position="absolute" top="1" left="0">') 
document.write('<table align="center">') 
document.write('<tr><td align="center"><a href="javascript:do_m1_n()">'+um1[0]+'</a></td></tr>') 
document.write('</table>') 
document.write('</layer>') 
document.write('<layer bgcolor="'+bordercolor+'" width="125" position="absolute" top="21" left="0">') 
document.write('<table align="center">') 
document.write('<tr><td align="center"></td></tr>') 
document.write('</table>') 
document.write('</layer>') 
document.write('<layer id="um1" position="absolute" top="22" left="0" bgcolor="'+bgcolorLight+'" width="125">') 
document.write('<table align="center">') 

else if(bw.ns5){ 
height=innerHeight-1; 
document.write('<div id="menubg" style="position:absolute;top:0;left:'+left+';background-color:'+bgcolorLight+';border-style:solid;border-width:1px;border-color:'+bordercolor+';width:127;height:'+height+';border-top-width:0px">') 
document.write('</div>') 
document.write('<div id="m" style="position:absolute;top:'+top+';left:'+left+'">') 
document.write('<div style="background-color:'+bgcolorDark+';border-style:solid;border-width:1px;border-color:'+bordercolor+';width:127">') 
document.write('<table align="center">') 
document.write('<tr><td align="center"><a href="javascript:do_m1_n6()">'+um1[0]+'</a></td></tr>') 
document.write('</table>') 
document.write('</div>') 
document.write('<div id="um1" style="position:absolute;top:18;left:0;background-color:'+bgcolorLight+';border-style:solid;border-width:1px;border-color:'+bordercolor+';width:127;border-bottom-width:0px">') 
document.write('<table align="center">') 

else{ 
height=document.body.offsetHeight-4; 
document.write('<div id="menubg" style="position:absolute;top:0;left:'+left+';background-color:'+bgcolorLight+';border-style:solid;border-width:1px;border-color:'+bordercolor+';width:127;height:'+height+';border-top-width:0px">') 
document.write('</div>') 
document.write('<div id="m" style="position:absolute;top:'+top+';left:'+left+'">') 
document.write('<div style="background-color:'+bgcolorDark+';border-style:solid;border-width:1px;border-color:'+bordercolor+';width:127">') 
document.write('<table align="center">') 
document.write('<tr><td align="center"><a href="#">'+um1[0]+'</a></td></tr>') 
document.write('</table>') 
document.write('</div>') 
document.write('<div id="um1" style="position:absolute;top:20;left:0;background-color:'+bgcolorLight+';border-style:solid;border-width:1px;border-color:'+bordercolor+';width:127;border-bottom-width:0px">') 
document.write('<table align="center">') 

init2(); 

function init2() 

if(um1nr < um1length){ 
document.write('<tr><td align="center"><a href="'+um1[um1nr3]+'">'+um1[um1nr2]+'</a></td></tr>'); 
um1nr++; 
um1nr2=um1nr2+2; 
um1nr3=um1nr3+2; 
init2(); 

else{ 
init3(); 


function init3() 

if(bw.ie6 || bw.ie4 || bw.ie5){ 
document.write('</table>') 
document.write('</div>') 
document.write('<div id="m1" style="position:absolute;top:20;left:0">') 
document.write('<div style="background-color:'+bgcolorDark+';border-style:solid;border-width:1px;border-color:'+bordercolor+';width:127">') 
document.write('<table align="center">') 
document.write('<tr><td align="center"><a href="javascript:do_m2_ie()">'+um2[0]+'</a></td></tr>') 
document.write('</table>') 
document.write('</div>') 
document.write('<div id="um2" style="position:absolute;top:20;left:0;background-color:'+bgcolorLight+';border-style:solid;border-width:1px;border-color:'+bordercolor+';width:127;border-bottom-width:0px">') 
document.write('<table align="center">') 

else if(bw.ns4){ 
document.write('</table>') 
document.write('</layer>') 
document.write('<layer id="m1" position="absolute" top="21" left="0">') 
document.write('<layer bgcolor="'+bordercolor+'" width="125">') 
document.write('<table align="center">') 
document.write('<tr><td align="center"></td></tr>') 
document.write('</table>') 
document.write('</layer>') 
document.write('<layer bgcolor="'+bgcolorDark+'" width="125" position="absolute" top="1" left="0">') 
document.write('<table align="center">') 
document.write('<tr><td align="center"><a href="javascript:do_m2_n()">'+um2[0]+'</a></td></tr>') 
document.write('</table>') 
document.write('</layer>') 
document.write('<layer bgcolor="'+bordercolor+'" width="125" position="absolute" top="21" left="0">') 
document.write('<table align="center">') 
document.write('<tr><td align="center"></td></tr>') 
document.write('</table>') 
document.write('</layer>') 
document.write('<layer id="um2" position="absolute" top="22" left="0" bgcolor="'+bgcolorLight+'" width="125">') 
document.write('<table align="center">') 

else if(bw.ns5){ 
document.write('</table>') 
document.write('</div>') 
document.write('<div id="m1" style="position:absolute;top:18;left:0">') 
document.write('<div style="background-color:'+bgcolorDark+';border-style:solid;border-width:1px;border-color:'+bordercolor+';width:127">') 
document.write('<table align="center">') 
document.write('<tr><td align="center"><a href="javascript:do_m2_n6()">'+um2[0]+'</a></td></tr>') 
document.write('</table>') 
document.write('</div>') 
document.write('<div id="um2" style="position:absolute;top:18;left:0;background-color:'+bgcolorLight+';border-style:solid;border-width:1px;border-color:'+bordercolor+';width:127;border-bottom-width:0px">') 
document.write('<table align="center">') 

else{ 
document.write('</table>') 
document.write('</div>') 
document.write('<div id="m1" style="position:absolute;top:'+((um1.length-1)/2*17.5+20)+';left:0">') 
document.write('<div style="background-color:'+bgcolorDark+';border-style:solid;border-width:1px;border-color:'+bordercolor+';width:127">') 
document.write('<table align="center">') 
document.write('<tr><td align="center"><a href="#">'+um2[0]+'</a></td></tr>') 
document.write('</table>') 
document.write('</div>') 
document.write('<div id="um2" style="position:absolute;top:20;left:0;background-color:'+bgcolorLight+';border-style:solid;border-width:1px;border-color:'+bordercolor+';width:127;border-bottom-width:0px">') 
document.write('<table align="center">') 

init4(); 

function init4() 

if(um2nr < um2length){ 
document.write('<tr><td align="center"><a href="'+um2[um2nr3]+'">'+um2[um2nr2]+'</a></td></tr>'); 
um2nr++; 
um2nr2=um2nr2+2; 
um2nr3=um2nr3+2; 
init4(); 

else{ 
init5(); 


function init5() 

if(bw.ie6 || bw.ie4 || bw.ie5){ 
document.write('</table>') 
document.write('</div>') 
document.write('<div id="m2" style="position:absolute;top:20;left:0">') 
document.write('<div style="background-color:'+bgcolorDark+';border-style:solid;border-width:1px;border-color:'+bordercolor+';width:127">') 
document.write('<table align="center">') 
document.write('<tr><td align="center"><a href="javascript:do_m3_ie()">'+um3[0]+'</a></td></tr>') 
document.write('</table>') 
document.write('</div>') 
document.write('<div id="um3" style="position:absolute;top:20;left:0;background-color:'+bgcolorLight+';border-style:solid;border-width:1px;border-color:'+bordercolor+';width:127;border-bottom-width:0px">') 
document.write('<table align="center">') 

else if(bw.ns4){ 
document.write('</table>') 
document.write('</layer>') 
document.write('<layer id="m2" position="absolute" top="21" left="0">') 
document.write('<layer bgcolor="'+bordercolor+'" width="125">') 
document.write('<table align="center">') 
document.write('<tr><td align="center"></td></tr>') 
document.write('</table>') 
document.write('</layer>') 
document.write('<layer bgcolor="'+bgcolorDark+'" width="125" position="absolute" top="1" left="0">') 
document.write('<table align="center">') 
document.write('<tr><td align="center"><a href="javascript:do_m3_n()">'+um3[0]+'</a></td></tr>') 
document.write('</table>') 
document.write('</layer>') 
document.write('<layer bgcolor="'+bordercolor+'" width="125" position="absolute" top="21" left="0">') 
document.write('<table align="center">') 
document.write('<tr><td align="center"></td></tr>') 
document.write('</table>') 
document.write('</layer>') 
document.write('<layer id="um3" position="absolute" top="22" left="0" bgcolor="'+bgcolorLight+'" width="125">') 
document.write('<table align="center">') 

else if(bw.ns5){ 
document.write('<tr><td align="center"><a href="'+um1[24]+'">'+um1[23]+'</a></td></tr>'); 
document.write('</table>') 
document.write('</div>') 
document.write('<div id="m1" style="position:absolute;top:18;left:0">') 
document.write('<div style="background-color:'+bgcolorDark+';border-style:solid;border-width:1px;border-color:'+bordercolor+';width:127">') 
document.write('<table align="center">') 
document.write('<tr><td align="center"><a href="javascript:do_m2_n6()">'+um2[0]+'</a></td></tr>') 
document.write('</table>') 
document.write('</div>') 
document.write('<div id="um2" style="position:absolute;top:18;left:0;background-color:'+bgcolorLight+';border-style:solid;border-width:1px;border-color:'+bordercolor+';width:127;border-bottom-width:0px">') 
document.write('<table align="center">') 

else{ 
document.write('</table>') 
document.write('</div>') 
document.write('<div id="m2" style="position:absolute;top:'+((um2.length-1)/2*17.5+20)+';left:0">') 
document.write('<div style="background-color:'+bgcolorDark+';border-style:solid;border-width:1px;border-color:'+bordercolor+';width:127">') 
document.write('<table align="center">') 
document.write('<tr><td align="center"><a href="#">'+um3[0]+'</a></td></tr>') 
document.write('</table>') 
document.write('</div>') 
document.write('<div id="um3" style="position:absolute;top:20;left:0;background-color:'+bgcolorLight+';border-style:solid;border-width:1px;border-color:'+bordercolor+';width:127;border-bottom-width:0px">') 
document.write('<table align="center">') 

init6(); 

function init6() 

if(um3nr < um3length){ 
document.write('<tr><td align="center"><a href="'+um3[um3nr3]+'">'+um3[um3nr2]+'</a></td></tr>'); 
um3nr++; 
um3nr2=um3nr2+2; 
um3nr3=um3nr3+2; 
init6(); 

else{ 
init7(); 


function init7() 

if(bw.ie6 || bw.ie5 || bw.ie4){ 
document.write('</table>') 
document.write('</div>') 
document.write('<div id="m3" style="height:'+((um3.length-1)/2*17.5+20+5)+';position:absolute;top:20;left:0;background-color:'+bgcolorLight+';border-style:solid;border-width:1px;border-color:'+bordercolor+';border-bottom-width:0px;width:127">') 
document.write('</div></div></div></div>') 

else if(bw.ns4){ 
document.write('</table>') 
document.write('</layer>') 
document.write('<layer id="m3" position="absolute" top="21" left="0" width="125" height="'+((um3.length-1)/2*20+20)+'" bgcolor="'+bgcolorLight+'">') 
document.write('<layer bgcolor="'+bordercolor+'" width="125" height="1">') 
document.write('</table></layer></table></layer></layer></layer></layer></layer>') 

else if(bw.ns5){ 
document.write('</table>') 
document.write('</div>') 
document.write('<div id="m3" style="height:'+((um3.length-1)/2*17.5+20+5)+';position:absolute;top:18;left:0;background-color:'+bgcolorLight+';border-style:solid;border-width:1px;border-color:'+bordercolor+';border-bottom-width:0px;width:127">') 
document.write('</div></div></div></div>') 

else{ 
document.write('</table>') 
document.write('</div>') 
document.write('<div id="m3" style="height:2;position:absolute;top:'+((um3.length-1)/2*17.5+20+5)+';left:0;background-color:'+bgcolorLight+';border-style:solid;border-width:1px;border-color:'+bordercolor+';border-bottom-width:0px;width:127">') 
document.write('</div></div></div></div>') 

var m1pos_ie=20, m1jump_ie=-5; 
var m2pos_ie=20, m2jump_ie=-5; 
var m3pos_ie=20, m3jump_ie=-5; 

var m1pos_n6=18, m1jump_n6=-6; 
var m2pos_n6=18, m2jump_n6=-6; 
var m3pos_n6=18, m3jump_n6=-6; 

var m1pos_n=21, m1jump_n=-5; 
var m2pos_n=21, m2jump_n=-5; 
var m3pos_n=21, m3jump_n=-5; 


var time=5; 


function do_m1_ie() 

if(m2pos_ie>0) 

m2jump_ie=-5; 
if(m2pos_ie>=(um2.length-1)/2*17.5+20) 
m2_move_ie(); 

if(m3pos_ie>0) 

m3jump_ie=-5; 
if(m3pos_ie>=(um3.length-1)/2*17.5+20) 
m3_move_ie(); 

m1jump_ie=-m1jump_ie; 
if(m1pos_ie<=20 || m1pos_ie>=(um1.length-1)/2*17.5+20) 
m1_move_ie(); 

function m1_move_ie(witch) 

document.all.m1.style.top=m1pos_ie; 
m1pos_ie+=m1jump_ie; 

if(m1pos_ie>15 && m1pos_ie<(um1.length-1)/2*17.5+20+5) 
setTimeout("m1_move_ie()", time); 


function do_m2_ie() 

if(m1pos_ie>0) 

m1jump_ie=-5; 
if(m1pos_ie>=(um1.length-1)/2*17.5+20) 
m1_move_ie(); 

if(m3pos_ie>0) 

m3jump_ie=-5; 
if(m3pos_ie>=(um3.length-1)/2*17.5+20) 
m3_move_ie(); 

m2jump_ie=-m2jump_ie; 
if(m2pos_ie<=20 || m2pos_ie>=(um2.length-1)/2*17.5+20) 
m2_move_ie(); 

function m2_move_ie() 

document.all.m2.style.top=m2pos_ie; 
m2pos_ie+=m2jump_ie; 

if(m2pos_ie>15 && m2pos_ie<(um2.length-1)/2*17.5+20+5) 
setTimeout("m2_move_ie()", time); 

function do_m3_ie() 

if(m2pos_ie>0) 

m2jump_ie=-5; 
if(m2pos_ie>=(um2.length-1)/2*17.5+20) 
m2_move_ie(); 

if(m1pos_ie>0) 

m1jump_ie=-5; 
if(m1pos_ie>=(um1.length-1)/2*17.5+20) 
m1_move_ie(); 

m3jump_ie=-m3jump_ie; 
if(m3pos_ie<=20 || m3pos_ie>=(um3.length-1)/2*17.5+20) 
m3_move_ie(); 

function m3_move_ie() 

document.all.m3.style.top=m3pos_ie; 
m3pos_ie+=m3jump_ie; 

if(m3pos_ie>15 && m3pos_ie<(um3.length-1)/2*17.5+20+5) 
setTimeout("m3_move_ie()", time); 


function do_m1_n() 

if(m2pos_n>0) 

m2jump_n=-5; 
if(m2pos_n>=(um2.length-1)/2*20+20) 
m2_move_n(); 

if(m3pos_n>0) 

m3jump_n=-5; 
if(m3pos_n>=(um3.length-1)/2*20+20) 
m3_move_n(); 

m1jump_n=-m1jump_n; 
if(m1pos_n<=21 || m1pos_n>=(um1.length-1)/2*20+20) 
m1_move_n(); 


function m1_move_n() 

document.m.document.m1.top=m1pos_n; 
m1pos_n+=m1jump_n; 

if(m1pos_n>=20 && m1pos_n<(um1.length-1)/2*20+20) 
setTimeout("m1_move_n()", time); 


function do_m2_n() 

if(m1pos_n>0) 

m1jump_n=-5; 
if(m1pos_n>=(um1.length-1)/2*20+20) 
m1_move_n(); 

if(m3pos_n>0) 

m3jump_n=-5; 
if(m3pos_n>=(um3.length-1)/2*20+20) 
m3_move_n(); 

m2jump_n=-m2jump_n; 
if(m2pos_n<=21 || m2pos_n>=(um2.length-1)/2*20+20) 
m2_move_n(); 

function m2_move_n() 

document.m.document.m1.document.m2.top=m2pos_n; 
m2pos_n+=m2jump_n; 

if(m2pos_n>20 && m2pos_n<(um2.length-1)/2*20+20) 
setTimeout("m2_move_n()", time); 

function do_m3_n() 

if(m2pos_n>0) 

m2jump_n=-5; 
if(m2pos_n>=(um2.length-1)/2*20+20) 
m2_move_n(); 

if(m1pos_n>0) 

m1jump_n=-5; 
if(m1pos_n>=(um1.length-1)/2*20+20) 
m1_move_n(); 

m3jump_n=-m3jump_n; 
if(m3pos_n<=21 || m3pos_n>=(um3.length-1)/2*20+20) 
m3_move_n(); 

function m3_move_n() 

document.m.document.m1.document.m2.document.m3.top=m3pos_n; 
m3pos_n+=m3jump_n; 

if(m3pos_n>20 && m3pos_n<(um3.length-1)/2*20+20) 
setTimeout("m3_move_n()", time); 


function do_m1_n6() 

if(m2pos_n6>0) 

m2jump_n6=-6; 
if(m2pos_n6>=(um2.length-1)/2*17.5+20) 
m2_move_n6(); 

if(m3pos_n6>0) 

m3jump_n6=-6; 
if(m3pos_n6>=(um3.length-1)/2*17.5+20) 
m3_move_n6(); 

m1jump_n6=-m1jump_n6; 
if(m1pos_n6<=18 || m1pos_n6>=(um1.length-1)/2*17.5+20) 
m1_move_n6(); 

function m1_move_n6() 

document.getElementById('m1').style.top=m1pos_n6; 
m1pos_n6+=m1jump_n6; 

if(m1pos_n6>15 && m1pos_n6<(um1.length-1)/2*17.5+20+5) 
setTimeout("m1_move_n6()", time); 


function do_m2_n6() 

if(m1pos_n6>0) 

m1jump_n6=-6; 
if(m1pos_n6>=(um1.length-1)/2*17.5+20) 
m1_move_n6(); 

if(m3pos_n6>0) 

m3jump_n6=-6; 
if(m3pos_n6>=(um3.length-1)/2*17.5+20) 
m3_move_n6(); 

m2jump_n6=-m2jump_n6; 
if(m2pos_n6<=18 || m2pos_n6>=(um2.length-1)/2*17.5+20) 
m2_move_n6(); 

function m2_move_n6() 

document.getElementById('m2').style.top=m2pos_n6; 
m2pos_n6+=m2jump_n6; 

if(m2pos_n6>15 && m2pos_n6<(um2.length-1)/2*17.5+20+5) 
setTimeout("m2_move_n6()", time); 

function do_m3_n6() 

if(m2pos_n6>0) 

m2jump_n6=-6; 
if(m2pos_n6>=(um2.length-1)/2*17.5+20) 
m2_move_n6(); 

if(m1pos_n6>0) 

m1jump_n6=-6; 
if(m1pos_n6>=(um1.length-1)/2*17.5+20) 
m1_move_n6(); 

m3jump_n6=-m3jump_n6; 
if(m3pos_n6<=18 || m3pos_n6>=(um3.length-1)/2*17.5+20) 
m3_move_n6(); 

function m3_move_n6() 

document.getElementById('m3').style.top=m3pos_n6; 
m3pos_n6+=m3jump_n6; 

if(m3pos_n6>15 && m3pos_n6<(um3.length-1)/2*17.5+20+5) 
setTimeout("m3_move_n6()", time); 

//-->
</script>


林木培训
您的位置..
       
               

关于本站 | 本站地图 | 联系方式 | 广告合作 | 广告价格
QQ:284700360 Email:linmupeixun@163.com
Copy Right © 2006 林木培训版权所有