z-blog滑动订阅按钮代码-不是俺的博客？

看到一些博客里面有可伸缩的滑动订阅按钮（就是把鼠标放到大按钮上就能自动滑出小按钮，鼠标离开的时候再自动滑进），感觉这样既有趣又能节约侧边栏空间，就想把它拿来。看了看代码，很简单，就是用了java script。当然并非只是zblog能用，按理说wordpress、oblog、boblog、pjblog、xblog等等博客系统都能用，其他BSP的博客系统如果支持js就可以用。

代码如下：

 
   <script type="text/javascript">
           function popMenu(objId) {
           var obj = document.getElementById(objId);
           if (obj.style.display == 'none') {
               obj.style.display = 'block';
           } else {
               obj.style.display = 'none';
               }
          }       
    </script>
<!--上面这是滑动效果所需要的js代码，如果浏览器禁用了js，效果就没了！-->
 
<div  class="function" id="menuCaption" onmouseover="popMenu('menuLists');" onmouseout="popMenu('menuLists');" align="center">
<!--上面这句的意思是说，被这个div框起来的东西就是一直露在外面的那玩意儿 ->
<a href="http://feed.feedsky.com/butwho" rel="nofollow"><img style="padding:10px 2px 2px 10px;" alt="RSS Feed" title="rss订阅" src="http://www.butwho.net/image/logo/rss01.gif" /></a>
 
<!--上面这是大号的订阅按钮，大家在用的时候可以自己挑张好看的图片-->
 
 <div id="menuLists" style="display:none;" align="center">
<!--上面这句的意思是说，被这个div框起来的东西就是收缩进去的那玩意儿 ->
<!-- Feedsky FEED发布代码开始 -->
<!-- #######这儿放上feedsky或者其他feed什么的发布代码######-->
<!-- Feedsky FEED发布代码结束 -->
 
</div>
</div>
   <script type="text/javascript">           function popMenu(objId) {           var obj = document.getElementById(objId);           if (obj.style.display == 'none') {               obj.style.display = 'block';           } else {               obj.style.display = 'none';               }          }           </script><!--上面这是滑动效果所需要的js代码，如果浏览器仅用了js，效果就没了！--><div  class="function" id="menuCaption" onmouseover="popMenu('menuLists');" onmouseout="popMenu('menuLists');" align="center"><!--上面这句的意思是说，被这个div框起来的东西就是一直露在外面的那玩意儿 -><a href="http://feed.feedsky.com/butwho" rel="nofollow"><img style="padding:10px 2px 2px 10px;" alt="RSS Feed" title="rss订阅" src="http://www.butwho.net/image/logo/rss01.gif" /></a><!--上面这是大号的订阅按钮，大家在用的时候可以自己挑张好看的图片--> <div id="menuLists" style="display:none;" align="center"><!--上面这句的意思是说，被这个div框起来的东西就是收缩进去的那玩意儿 -><!-- Feedsky FEED发布代码开始 --><!-- #######这儿放上feedsky或者其他feed什么的发布代码######--><!-- Feedsky FEED发布代码结束 --></div></div>

下边是效果演示:

使用的时候，把上面一段代码放到合适的地方即可。
**啥是合适的地方？对于俺用的zblog 1.7来说，就是TEMPLATE模版文件夹下default.html或者single.html文件中的一个地方，比如<div id="divSidebar">这一行的后面。

插入的订阅代码后面，可以再加上“添加到收藏夹”代码和邮件订阅代码，这样虽然多了一个收藏按钮和邮件订阅按钮，但由于这些按钮平时都是收缩状态，并不用担心他们会占用太多地方。

其实这件事情俺以前说过，不过这次公布的是技术细节。也没啥技术含量，放到这儿只是为了显摆罢了。俺的侧边拦就用了这个效果，好事者可以去点击几下看看。

另外，俺在一些地方见到过一个不用javascript只用CSS就能完成的滑动效果，但是俺基本上是个代码盲，没有能力(或者说是没有精力)把那些代码改成俺所需要的形式。好事者可以点击这儿下载css滑动效果代码，然后改成俺的rss订阅按钮那种形式送给俺。不胜感激！