js滑門,js滑門效果,js滑動(dòng),js選項(xiàng)卡 js滑門特效 將下列代碼保存為html運(yùn)行即可
<STYLE type=text/css>
.titleStyle{
background-color:#AAC9D9;
color:#000066;
border-top:1px solid #FFFFFF;
font-size:12px;
cursor:hand;
font-weight: bold;
text-align: left;
padding-left: 20px;
}
.contentStyle{
background-color:#DDEAF0;
color:blue;
font-size:12px;
text-align: left;
padding-left: 20px;
line-height: 200%;
}
</STYLE>
<TABLE>
<TBODY>
<TR>
<TD><A onclick=changeItem(0); href="#">1</A> <A onclick=changeItem(1); href="#">2</A></TD></TR></TBODY></TABLE>
<SCRIPT language=JavaScript>
<!--
var layerTop=0;
var layerLeft=0;
var layerWidth=180;
var titleHeight=28;
var contentHeight=300;
var stepNo=10;
var itemNo=0;runtimes=0;
document.write('<span id=itemsLayer style="position:relative;overflow:hidden;border:1px solid #AAC9D9;left:'+layerLeft+';top:'+layerTop+';width:'+layerWidth+';">');
function addItem(itemTitle,itemContent)
{
itemHTML='<div id=item'+itemNo+' itemIndex='+itemNo+' style="position:relative;left:0;top:'+(-contentHeight*itemNo)+';width:'+layerWidth+';"><table width=100% cellspacing="0" cellpadding="0">'+
'<tr><td height='+titleHeight+' onclick=changeItem('+itemNo+') class="titleStyle" align=center>'+itemTitle+'</td></tr>'+
'<tr><td height='+contentHeight+' class="contentStyle">'+itemContent+'</td></tr></table></div>';
document.write(itemHTML);
itemNo++;
}
addItem('桌面環(huán)境管理外包','<a href="年目錄</a> <BR><a href="年目錄</a> <BR>');
addItem('IT外包服務(wù)','<a href="">桌面環(huán)境管理外包</a> <BR><a href="">系統(tǒng)維護(hù)外包</a> <BR><a href="">基礎(chǔ)架構(gòu)管理外包</a> <BR><a href="">圖文設(shè)計(jì)外包</a><BR><a href="">網(wǎng)站維護(hù)外包</a><BR><a href="">數(shù)據(jù)恢復(fù)服務(wù)</a><BR><a href="小時(shí)工</a><BR><a href="">項(xiàng)目外包服務(wù)</a><BR><a href="">關(guān)于IT外包</a><BR><a href="救援</a><BR><a href=");
addItem('軟件工程外包','<a href="">[博客技巧]展開式菜單</a> <BR><a href="">[照片]第一集</a> <BR><a href="">[單片機(jī)學(xué)習(xí)]AT89S51教程</a> <BR>');
addItem('網(wǎng)站建設(shè)與推廣','<a href="">單片機(jī)論壇 </a> <BR><a href="
addItem('系統(tǒng)集成','<a href="">征集中...</a> <BR>'); addItem('網(wǎng)絡(luò)安全培訓(xùn)','<a href="">征集中...</a> <BR>'); addItem('客戶服務(wù)中心','<a href="">征集中...</a> <BR>'); document.write('</span>') document.all.itemsLayer.style.height=itemNo*titleHeight+contentHeight; toItemIndex=itemNo-1;onItemIndex=itemNo-1; function changeItem(clickItemIndex) { toItemIndex=clickItemIndex; if(toItemIndex-onItemIndex>0) moveUp(); else moveDown(); runtimes++; if(runtimes>=stepNo){ onItemIndex=toItemIndex; runtimes=0;} else setTimeout("changeItem(toItemIndex)",10); } function moveUp() { for(i=onItemIndex+1;i<=toItemIndex;i++) eval('document.all.item'+i+'.style.top=parseInt(document.all.item'+i+'.style.top)-contentHeight/stepNo;'); } function moveDown() { for(i=onItemIndex;i>toItemIndex;i--) eval('document.all.item'+i+'.style.top=parseInt(document.all.item'+i+'.style.top)+contentHeight/stepNo;'); } var clickid changeItem(0); //--> </SCRIPT> 更多信息請(qǐng)查看IT技術(shù)專欄