您的位置:首页 > Web前端 > JavaScript

折叠展开收缩效果的栏目分类导航

2008-11-22 18:25 267 查看
<script type="text/javascript"><!--
google_ad_client = "pub-4490194096475053";
/* 内容页,300x250,第一屏 */
google_ad_slot = "3685991503";
google_ad_width = 300;
google_ad_height = 250;
//-->
</script>
<script type="text/javascript"
src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
</script><html>

<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>网页特效代码|JsCode.CN|---可折叠展开收缩效果的栏目分类导航</title>
<style type="text/css">
td {font-size: 12px;}
</style>
</head>

<body>

<table width="200" height="250" border="0" align="center" cellpadding="0" cellspacing="0">
<tr>
<td height="38">
<img height="38" src="images/leftlist_head.jpg" width="200" /></td>
</tr>
<tr>
<td align="center" valign="top" background="images/leftlist_bg.jpg">
<script language="javascript" id="clientEventHandlersJS">
<!--
var number=8;

function LMYC() {
var lbmc;
//var treePic;
for (i=1;i<=number;i++) {
lbmc = eval('LM' + i);
//treePic = eval('treePic'+i);
//treePic.src = 'images/file.gif';
lbmc.style.display = 'none';
}
}

function ShowFLT(i) {
lbmc = eval('LM' + i);
//treePic = eval('treePic' + i)
if (lbmc.style.display == 'none') {
LMYC();
//treePic.src = 'images/nofile.gif';
lbmc.style.display = '';
}
else {
//treePic.src = 'images/file.gif';
lbmc.style.display = 'none';
}
}
//-->
</script>
<table cellspacing="0" cellpadding="0" width="88%" border="0">
<tr>
<td style="PADDING-LEFT: 20px" background height="23">
<img height="9" src="images/bit05.gif" width="8" align="absMiddle">
<a onclick="javascript:ShowFLT(1)" href="javascript:void(null)">
文管产品</a> </td>
</tr>
<tr id="LM1" style="DISPLAY: none">
<td>
<table cellspacing="0" cellpadding="0" width="100%" border="0">
<tr>
<td style="PADDING-LEFT: 40px" height="23">
<img height="7" src="images/bit06.gif" width="8" align="absMiddle">
<a title="文件夹" href="http://www.jscode.cn" target="_parent">
文件夹</a> </td>
</tr>
<tr>
<td background height="3"></td>
</tr>
<tr>
<td style="PADDING-LEFT: 40px" height="23">
<img height="7" src="images/bit06.gif" width="8" align="absMiddle">
<a title="资料册" href="http://www.jscode.cn" target="_parent">
资料册</a> </td>
</tr>
<tr>
<td background height="3"></td>
</tr>
<tr>
<td style="PADDING-LEFT: 40px" height="23">
<img height="7" src="images/bit06.gif" width="8" align="absMiddle">
<a title="档案盒" href="http://www.jscode.cn" target="_parent">
档案盒</a> </td>
</tr>
<tr>
<td background height="3"></td>
</tr>
<tr>
<td style="PADDING-LEFT: 40px" height="23">
<img height="7" src="images/bit06.gif" width="8" align="absMiddle">
<a title="文件盒" href="http://www.jscode.cn" target="_parent">
文件盒</a> </td>
</tr>
<tr>
<td background height="3"></td>
</tr>
<tr>
<td style="PADDING-LEFT: 40px" height="23">
<img height="7" src="images/bit06.gif" width="8" align="absMiddle">
<a title="文件柜" href="http://www.jscode.cn" target="_parent">
文件柜</a> </td>
</tr>
<tr>
<td background height="3"></td>
</tr>
<tr>
<td style="PADDING-LEFT: 40px" height="23">
<img height="7" src="images/bit06.gif" width="8" align="absMiddle">
<a title="公文包" href="http://www.jscode.cn" target="_parent">
公文包</a> </td>
</tr>
<tr>
<td background height="3"></td>
</tr>
</table>
</td>
</tr>
<tr>
<td style="PADDING-LEFT: 20px" background height="23">
<img height="9" src="images/bit05.gif" width="8" align="absMiddle">
<a onclick="javascript:ShowFLT(2)" href="javascript:void(null)">
桌面文具</a> </td>
</tr>
<tr id="LM2" style="DISPLAY: none">
<td>
<table cellspacing="0" cellpadding="0" width="100%" border="0">
<tr>
<td style="PADDING-LEFT: 40px" height="23">
<img height="7" src="images/bit06.gif" width="8" align="absMiddle">
<a title="削笔机" href="http://www.jscode.cn" target="_parent">
削笔机</a> </td>
</tr>
<tr>
<td background height="3"></td>
</tr>
<tr>
<td style="PADDING-LEFT: 40px" height="23">
<img height="7" src="images/bit06.gif" width="8" align="absMiddle">
<a title="订书机" href="http://www.jscode.cn" target="_parent">
订书机</a> </td>
</tr>
<tr>
<td background height="3"></td>
</tr>
</table>
</td>
</tr>
<tr>
<td style="PADDING-LEFT: 20px" background height="23">
<img height="9" src="images/bit05.gif" width="8" align="absMiddle">
<a onclick="javascript:ShowFLT(3)" href="javascript:void(null)">
商用机器</a> </td>
</tr>
<tr id="LM3" style="DISPLAY: none">
<td>
<table cellspacing="0" cellpadding="0" width="100%" border="0">
<tr>
<td style="PADDING-LEFT: 40px" height="23">
<img height="7" src="images/bit06.gif" width="8" align="absMiddle">
<a title="碎纸机" href="http://www.jscode.cn" target="_parent">
碎纸机</a> </td>
</tr>
<tr>
<td background height="3"></td>
</tr>
<tr>
<td style="PADDING-LEFT: 40px" height="23">
<img height="7" src="images/bit06.gif" width="8" align="absMiddle">
<a title="切纸刀" href="http://www.jscode.cn" target="_parent">
切纸刀</a> </td>
</tr>
<tr>
<td background height="3"></td>
</tr>
</table>
</td>
</tr>
<tr>
<td style="PADDING-LEFT: 20px" background height="23">
<img height="9" src="images/bit05.gif" width="8" align="absMiddle">
<a onclick="javascript:ShowFLT(4)" href="javascript:void(null)">
书写工具</a> </td>
</tr>
<tr id="LM4">
<td>
<table cellspacing="0" cellpadding="0" width="100%" border="0">
<tr>
<td style="PADDING-LEFT: 40px" height="23">
<img height="7" src="images/bit06.gif" width="8" align="absMiddle">
<a title="中性笔" href="http://www.jscode.cn" target="_parent">
中性笔</a> </td>
</tr>
<tr>
<td background height="3"></td>
</tr>
<tr>
<td style="PADDING-LEFT: 40px" height="23">
<img height="7" src="images/bit06.gif" width="8" align="absMiddle">
<a title="圆珠笔" href="http://www.jscode.cn" target="_parent">
圆珠笔</a> </td>
</tr>
<tr>
<td background height="3"></td>
</tr>
<tr>
<td style="PADDING-LEFT: 40px" height="23">
<img height="7" src="images/bit06.gif" width="8" align="absMiddle">
<a title="记号笔" href="http://www.jscode.cn" target="_parent">
记号笔</a> </td>
</tr>
<tr>
<td background height="3"></td>
</tr>
<tr>
<td style="PADDING-LEFT: 40px" height="23">
<img height="7" src="images/bit06.gif" width="8" align="absMiddle">
<a title="白板笔" href="http://www.jscode.cn" target="_parent">
白板笔</a> </td>
</tr>
<tr>
<td background height="3"></td>
</tr>
</table>
</td>
</tr>
<tr>
<td style="PADDING-LEFT: 20px" background height="23">
<img height="9" src="images/bit05.gif" width="8" align="absMiddle">
<a onclick="javascript:ShowFLT(5)" href="javascript:void(null)">
纸制品</a> </td>
</tr>
<tr id="LM5" style="DISPLAY: none">
<td>
<table cellspacing="0" cellpadding="0" width="100%" border="0">
<tr>
<td style="PADDING-LEFT: 40px" height="23">
<img height="7" src="images/bit06.gif" width="8" align="absMiddle">
<a title="传真纸" href="http://jscode.cn" target="_parent">
传真纸</a> </td>
</tr>
<tr>
<td background height="3"></td>
</tr>
<tr>
<td style="PADDING-LEFT: 40px" height="23">
<img height="7" src="images/bit06.gif" width="8" align="absMiddle">
<a title="复印纸" href="http://www.jscode.cn" target="_parent">
复印纸</a> </td>
</tr>
<tr>
<td background height="3"></td>
</tr>
<tr>
<td style="PADDING-LEFT: 40px" height="23">
<img height="7" src="images/bit06.gif" width="8" align="absMiddle">
<a title="复写纸" href="http://www.jscode.cn" target="_parent">
复写纸</a> </td>
</tr>
<tr>
<td background height="3"></td>
</tr>
<tr>
<td style="PADDING-LEFT: 40px" height="23">
<img height="7" src="images/bit06.gif" width="8" align="absMiddle">
<a title="便条纸" href="http://www.jscode.cn" target="_parent">
便条纸</a> </td>
</tr>
<tr>
<td background height="3"></td>
</tr>
<tr>
<td style="PADDING-LEFT: 40px" height="23">
<img height="7" src="images/bit06.gif" width="8" align="absMiddle">
<a title="百事贴" href="http://www.jscode.cn" target="_parent">
百事贴</a> </td>
</tr>
<tr>
<td background height="3"></td>
</tr>
<tr>
<td style="PADDING-LEFT: 40px" height="23">
<img height="7" src="images/bit06.gif" width="8" align="absMiddle">
<a title="皮面笔记本" href="http://www.jscode.cn" target="_parent">
皮面笔记本</a> </td>
</tr>
<tr>
<td background height="3"></td>
</tr>
</table>
</td>
</tr>
<tr>
<td style="PADDING-LEFT: 20px" background height="23">
<img height="9" src="images/bit05.gif" width="8" align="absMiddle">
<a onclick="javascript:ShowFLT(6)" href="javascript:void(null)">
办公电子</a> </td>
</tr>
<tr id="LM6" style="DISPLAY: none">
<td>
<table cellspacing="0" cellpadding="0" width="100%" border="0">
<tr>
<td style="PADDING-LEFT: 40px" height="23">
<img height="7" src="images/bit06.gif" width="8" align="absMiddle">
<a title="计算器" href="http://www.jscode.cn" target="_parent">
计算器</a> </td>
</tr>
<tr>
<td background height="3"></td>
</tr>
</table>
</td>
</tr>
<tr>
<td style="PADDING-LEFT: 20px" background height="23">
<img height="9" src="images/bit05.gif" width="8" align="absMiddle">
<a onclick="javascript:ShowFLT(7)" href="javascript:void(null)">
IT周边产品</a> </td>
</tr>
<tr id="LM7" style="DISPLAY: none">
<td>
<table cellspacing="0" cellpadding="0" width="100%" border="0">
<tr>
<td style="PADDING-LEFT: 40px" height="23">
<img height="7" src="images/bit06.gif" width="8" align="absMiddle">
<a title="阅读架" href="http://www.jscode.cn" target="_parent">
阅读架</a> </td>
</tr>
<tr>
<td background height="3"></td>
</tr>
<tr>
<td style="PADDING-LEFT: 40px" height="23">
<img height="7" src="images/bit06.gif" width="8" align="absMiddle">
<a title="CD保护" href="http://www.jscode.cn" target="_parent">
CD保护</a> </td>
</tr>
<tr>
<td background height="3"></td>
</tr>
<tr>
<td style="PADDING-LEFT: 40px" height="23">
<img height="7" src="images/bit06.gif" width="8" align="absMiddle">
<a title="光盘盒" href="http://www.jscode.cn" target="_parent">
光盘盒</a> </td>
</tr>
<tr>
<td background height="3"></td>
</tr>
</table>
</td>
</tr>
<tr>
<td style="PADDING-LEFT: 20px" background height="23">
<img height="9" src="images/bit05.gif" width="8" align="absMiddle">
<a onclick="javascript:ShowFLT(8)" href="javascript:void(null)">
办公生活用品</a> </td>
</tr>
<tr id="LM8" style="DISPLAY: none">
<td>
<table cellspacing="0" cellpadding="0" width="100%" border="0">
<tr>
<td style="PADDING-LEFT: 40px" height="23">
<img height="7" src="images/bit06.gif" width="8" align="absMiddle">
<a title="清洁桶" href="http://www.jscode.cn" target="_parent">
清洁桶</a> </td>
</tr>
<tr>
<td background height="3"></td>
</tr>
<tr>
<td style="PADDING-LEFT: 40px" height="23">
<img height="7" src="images/bit06.gif" width="8" align="absMiddle">
<a title="白板" href="http://www.jscode.cn" target="_parent">
白板</a> </td>
</tr>
<tr>
<td background height="3"></td>
</tr>
<tr>
<td style="PADDING-LEFT: 40px" height="23">
<img height="7" src="images/bit06.gif" width="8" align="absMiddle">
<a title="网状文具" href="http://www.jscode.cn" target="_parent">
网状文具</a> </td>
</tr>
<tr>
<td background height="3"></td>
</tr>
<tr>
<td style="PADDING-LEFT: 40px" height="23">
<img height="7" src="images/bit06.gif" width="8" align="absMiddle">
<a title="封箱器" href="http://www.jscode.cn" target="_parent">
封箱器</a> </td>
</tr>
<tr>
<td background height="3"></td>
</tr>
<tr>
<td style="PADDING-LEFT: 40px" height="23">
<img height="7" src="images/bit06.gif" width="8" align="absMiddle">
<a title="购物袋" href="http://www.jscode.cn" target="_parent">
购物袋</a> </td>
</tr>
<tr>
<td background height="3"></td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td height="17">
<img height="17" src="images/leftlist_bottom.jpg" width="200" /></td>
</tr>
</table>

</body>

</html>
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息