基于jQuery的横向连续滚动【原创】

当上周五匆匆瞥过W3CSchool上的jQuery教学讲解，小试过一个向下卷展的效果之后，愕然发觉，原本一直认为很复杂的需要花很多时间去研究的效果，又或者是只能从网上找来的JS效果，原来，就是可以通过jQuery这门技术，而轻而易举地，自己写出来！短短几行，简单清晰明了，效果立竿见影。一下子对jQuery好感倍增！

今天，又是新一周工作的开始。一进公司便想着如何实际运用一下jQuery。想到曾经领导想要把总部网站上的一个关于公司历史介绍的时间轴效果做到我们LOCAL的网站上（其实也就是历史介绍图片可以左右滚动，如下图，鼠标滑过左右箭头时，时间轴文字和图片都会产生向左或向右的滚动效果）。那时曾经自行研究过一阵，但是貌似没有成功，看着总部那考究的繁复的代码，一个又一个加载在里面的js,css，我头都晕了。这哪里是头啊？于是，今天，就想着能否自己模拟出来。

终于，功夫不负有心人，从上午一直研究到中午，还牺牲了本来就短暂而又宝贵的午间休息半个小时多，终于，研究出来了！

要解决的问题，其实主要有三：一是如何产生滚动效果？二是如何产生遮罩？三是如何悬停离开？