标签：
之前为大家分享了很多jquery插件，这次我们要来分享一款不太常见的jQuery插件，它是一个时间轴，时间轴上的每一个点在鼠标滑过时都可以显示该点的描述信息，并且鼠标滑过时都可以产生一定的动画特效，比如鼠标划过时圆圈的展开动画。
实现的代码。
html代码：
<div class="clearfix course_nr"> <ul class="course_nr2"> <li>1993 <div class="shiji"> <h1> 1993</h1> <p> 内容描述1。</p> </div> </li> <li>1999 <div class="shiji"> <h1> 1999</h1> <p> 内容描述2；</p> </div> </li> <li>2003 <div class="shiji"> <h1> 2003</h1> <p> 内容描述3</p> </div> </li> <li>2007 <div class="shiji"> <h1> 2007</h1> <p> 内容描述4</p> </div> </li> <li>2008 <div class="shiji"> <h1> 2008</h1> <p> 内容描述5</p> </div> </li> <li>2009 <div class="shiji"> <h1> 2009</h1> <p> 内容描述6</p> </div> </li> <li>2013 <div class="shiji"> <h1> 2013</h1> <p> 内容描述7</p> </div> </li> <li>2014 <div class="shiji"> <h1> 2014</h1> <p> 内容描述7</p> </div> </li> </ul> </div>
jquery代码：
$(function () { //首页大事记 $(‘.course_nr2 li‘).hover(function () { $(this).find(‘.shiji‘).slideDown(600); }, function () { $(this).find(‘.shiji‘).slideUp(400); }); });
via:http://www.w2bc.com/Article/13473
标签：
原文地址：http://www.cnblogs.com/liaohuolin/p/4183913.html
