博客大巴自定义模板给侧边栏添加展开收缩代码下载

文章类别：博客代码 | Tags:博客高级代码

本文转载自网络营销应用教程(http://www.szlsx.net)

原文链接地址: http://www.szlsx.net/logs/52773568.html 复制本文链接

　　不少博客都有侧边栏添加展开收缩效果，经研究发现，利用js代码，博客大巴也能实现这个功能。效果预览如下：见http://szly2000.blogbus.com边栏，其模板下载如下：http://www.szlsx.net/logs/44266485.html。

　　代码添加方法如下：

　　1.将下面代码加在head中。　　

　　全选
　　<style> #sidebar h2 {cursor:pointer;} </style> <script type="text/javascript"> /*这个函数放在header，value是你需要伸缩的模块的id名称*/ function hide(value){ var str=document.getElementById(value); var str1=str.getElementsByTagName("h2")[0]; str1.onclick=function(){ if((str.getElementsByTagName("div")[1].style.display=="block")||(str.getElementsByTagName("div")[1].style.display=="")) str.getElementsByTagName("div")[1].style.display="none"; else str.getElementsByTagName("div")[1].style.display="block"; } } </script>

　　2.将下面代码加在index与detail的最下面。

　　全选
　　<script type="text/javascript"> hide("nComments"); hide("links"); //执行在这里，放在index，这是link模块 hide("Calendar"); </script>

　　注：上面示例中，本人仅对最新评论、链接、日历三个模板进行了特效处理，若你要对其他模块采用此特效，只需在第2个添加如hide("Calendar");等，具体模块名称请参考：http://bbs.blogbus.com/viewthread.php?tid=50772&page=1&fromuid=2721#pid277562。

　　若你还有问题，请在本页留言。