一早起来，笑容兄弟跑过来问我这款皮肤右侧的rss效果是咋实现的，
嗯。。当时就猜想可能是js的onmouseover和onmouseout效果，没有太仔细看代码。那些JS调用的地方还没找到在哪。。
残念。。。
不过用firebug看一下，原来原理应该就是这样的，因为是改变了其CSS值嘛。呵。
看一下代码
<!-- 这里是iNove皮肤 sidebar.php中的部分代码 -->
<ul id="feed_readers">
<li id="google_reader"><a class="reader" title="<?php _e('Subscribe with ', 'inove'); _e('Google', 'inove'); ?>" href="http://fusion.google.com/add?feedurl=<?php echo $feed; ?>"><span><?php _e('Google', 'inove'); ?></span></a></li>
<li id="youdao_reader"><a class="reader" title="<?php _e('Subscribe with ', 'inove'); _e('Youdao', 'inove'); ?>" href="http://reader.youdao.com/#url=<?php echo $feed; ?>"><span><?php _e('Youdao', 'inove'); ?></span></a></li>
<li id="xianguo_reader"><a class="reader" title="<?php _e('Subscribe with ', 'inove'); _e('Xian Guo', 'inove'); ?>" href="http://www.xianguo.com/subscribe.php?url=<?php echo $feed; ?>"><span><?php _e('Xian Guo', 'inove'); ?></span></a></li>
<li id="zhuaxia_reader"><a class="reader" title="<?php _e('Subscribe with ', 'inove'); _e('Zhua Xia', 'inove'); ?>" href="http://www.zhuaxia.com/add_channel.php?url=<?php echo $feed; ?>"><span><?php _e('Zhua Xia', 'inove'); ?></span></a></li>
<li id="yahoo_reader"><a class="reader" title="<?php _e('Subscribe with ', 'inove'); _e('My Yahoo!', 'inove'); ?>" href="http://add.my.yahoo.com/rss?url=<?php echo $feed; ?>"><span><?php _e('My Yahoo!', 'inove'); ?></span></a></li>
<li id="newsgator_reader"><a class="reader" title="<?php _e('Subscribe with ', 'inove'); _e('newsgator', 'inove'); ?>" href="http://www.newsgator.com/ngs/subscriber/subfext.aspx?url=<?php echo $feed; ?>"><span><?php _e('newsgator', 'inove'); ?></span></a></li>
<li id="bloglines_reader"><a class="reader" title="<?php _e('Subscribe with ', 'inove'); _e('Bloglines', 'inove'); ?>" href="http://www.bloglines.com/sub/<?php echo $feed; ?>"><span><?php _e('Bloglines', 'inove'); ?></span></a></li>
<li id="inezha_reader"><a class="reader" title="<?php _e('Subscribe with ', 'inove'); _e('iNezha', 'inove'); ?>" href="http://inezha.com/add?url=<?php echo $feed; ?>"><span><?php _e('iNezha', 'inove'); ?></span></a></li>
</ul>
<ul id="feed_readers">
<li id="google_reader"><a class="reader" title="<?php _e('Subscribe with ', 'inove'); _e('Google', 'inove'); ?>" href="http://fusion.google.com/add?feedurl=<?php echo $feed; ?>"><span><?php _e('Google', 'inove'); ?></span></a></li>
<li id="youdao_reader"><a class="reader" title="<?php _e('Subscribe with ', 'inove'); _e('Youdao', 'inove'); ?>" href="http://reader.youdao.com/#url=<?php echo $feed; ?>"><span><?php _e('Youdao', 'inove'); ?></span></a></li>
<li id="xianguo_reader"><a class="reader" title="<?php _e('Subscribe with ', 'inove'); _e('Xian Guo', 'inove'); ?>" href="http://www.xianguo.com/subscribe.php?url=<?php echo $feed; ?>"><span><?php _e('Xian Guo', 'inove'); ?></span></a></li>
<li id="zhuaxia_reader"><a class="reader" title="<?php _e('Subscribe with ', 'inove'); _e('Zhua Xia', 'inove'); ?>" href="http://www.zhuaxia.com/add_channel.php?url=<?php echo $feed; ?>"><span><?php _e('Zhua Xia', 'inove'); ?></span></a></li>
<li id="yahoo_reader"><a class="reader" title="<?php _e('Subscribe with ', 'inove'); _e('My Yahoo!', 'inove'); ?>" href="http://add.my.yahoo.com/rss?url=<?php echo $feed; ?>"><span><?php _e('My Yahoo!', 'inove'); ?></span></a></li>
<li id="newsgator_reader"><a class="reader" title="<?php _e('Subscribe with ', 'inove'); _e('newsgator', 'inove'); ?>" href="http://www.newsgator.com/ngs/subscriber/subfext.aspx?url=<?php echo $feed; ?>"><span><?php _e('newsgator', 'inove'); ?></span></a></li>
<li id="bloglines_reader"><a class="reader" title="<?php _e('Subscribe with ', 'inove'); _e('Bloglines', 'inove'); ?>" href="http://www.bloglines.com/sub/<?php echo $feed; ?>"><span><?php _e('Bloglines', 'inove'); ?></span></a></li>
<li id="inezha_reader"><a class="reader" title="<?php _e('Subscribe with ', 'inove'); _e('iNezha', 'inove'); ?>" href="http://inezha.com/add?url=<?php echo $feed; ?>"><span><?php _e('iNezha', 'inove'); ?></span></a></li>
</ul>
firebug查看iNove rss效果css
懒得去找JS写在哪了。干脆用jQuery写一个类似的效果？哈。
定义一个样式，让一个div默认是隐藏的，嗯。之所以加了一个border完全是为了自己能看清楚。。。
#hid{display:none;border:1px solid;padding:2px 2px;}
还是套用之前jQuery教程里的代码。。（没办法，懒啊）
<a href="void(0)" id="a_hov">hover me </a>
<div id="hid">
<p>Hello</p><p>Hello Again</p><p class="selected">And Again</p>
</div>
<div id="hid">
<p>Hello</p><p>Hello Again</p><p class="selected">And Again</p>
</div>
$(document).ready(function(){
$("#a_hov").hover(function(){
$("#hid").show(3000);
},function(){
$("#hid").hide(3000);
});
});
$("#a_hov").hover(function(){
$("#hid").show(3000);
},function(){
$("#hid").hide(3000);
});
});
嘿嘿，完活，有想看完整代码的请去这里下载吧
安全无毒。嘿嘿。 
踩踩也好…沙发…