[原创]首次制作JQueryUI插件-Timeline时间轴

特点：

1. 支持多左右滚动，左右拖动。

2. 时间轴可上下两种显示方式。

3. 支持两种模式的平滑滚动/拖动。

4. 行压缩（后续版本此处可设置是否开启，上传的代码不带这个功能）。

5. 支持hover辅助线。

6. 支持多级缩放、鼠标滚轮缩放。

依赖：

jquery 1.11

jquer-ui 1.10

jquery-mousewheel

兼容：

Chrome、Firefox、IE8（没有圆角和阴影效果）

已知问题：

刻度图片和拖动画布时的鼠标图标可能会失效。原因是这个是写在js里设置的url，而url可能定位不准，不过在DEMO中因为路径是对的没有此问题。截止写这篇文章，刻度图片的问题已经解决，但上传的源代码还木有哦 – -|||。

比较有价值的点：

1. 平滑滚动/拖动的Advance模式，这里用到了一些小技巧，通过计算鼠标按下和松开的时间和距离（拖动），或者计算鼠标按下的持续时间（滚动），获得一个加速度，最后计算惯性距离，通过动画实现平滑，基本的初中物理学知识拿粗来用一下还是可以的哈哈。

2. 多级缩放时参考了一些响应式的设计思想，刻度条的刻度、文字等会有不同表现。

3. 行压缩算法，这个可能并不能算很高效的算法，毕竟我只能按照正常思维设计算法，然后再来优化。

4. 刻度计算算法，这个还有优化空间。

5. 因为第一次做JQuery-UI的插件，标准插件的开发方法和过程对我自己来说也是宝贵的经验。

6. 一些用户体验学的经验和设计自己感觉还比较满意，比如乱序动画等增加视觉效果、物理学平滑滚动等增加使用便捷度。

7. 最后骂一下坑爹的IE8，因为你如此奇葩，我特意为你准备了一个可爱的function叫“_fixIE8Height”，泥煤的！

8. 最后的最后这个是给公司做的，所有在时间非常有限的情况下，还是有点定制，后续如果我自己想用，还会改不少东西。代码仅供学习参考，请勿用于实际项目。

下载timeline-1.0