jQuery时间轴插件：jQuery Timelinr

这是一款可用于展示历史和计划的时间轴插件，尤其比较适合一些网站展示发展历程、大事件等场景。该插件基于jQuery，可以滑动切换、水平和垂直滚动、支持键盘方向键。经过扩展后可以支持鼠标滚轮事件。

 

 

 

查看演示DEMO   下载源码

 

HTML

我们在body中建立一个div#timeline作为展示区，#dates为时间轴，示例中我们用年份作为主轴，#issues作为内容展示区，即展示对应主轴点年份的内容，注意id对应上。

<div id="timeline"> 
   <ul id="dates"> 
      <li><a href="#2011">2011</a></li> 
      <li><a href="#2012">2012</a></li> 
   </ul> 
   <ul id="issues"> 
      <li id="2011"> 
         <p>Lorem ipsum.</p> 
      </li> 
      <li id="2012"> 
         <p>分享生活 留住感动</p> 
      </li&g