蠢只是借口，不是原因

在知道lazyload插件之后，我的任务是延迟加载banner，首先想都没有想就要直接用插件（有现成的不用非要自己写那不是傻吗），果断去了解插件怎么使用，按照人家的demo，依着葫芦画瓢，也没有继续往下看文档。发现自己的代码原来不是img标签，而是div的background-image ，后来发现lazyload中用到的load事件根本不能用在div上，只能用在适用于任何带有 URL 的元素（比如图像、脚本、框架、内联框架），所以，为了实现效果，果断将原来的div换成了img ，欣喜的完成之后，才发现，浏览器的窗口变化banner的图片就会被拉伸或者压缩，这果断不符合要求，结果就是Try again。

又将原来的代码还原，再次自己阅读人家lazyload的文档，发现，人家的插件是支持用div的banckground-image的，于是果断再次照着葫芦画瓢，代码是完成了，但是效果却没有实现，后来才发现，原来是lazyload和bootstrap的carousel插件起了冲突，无奈，不能改原来的代码，没有别的部分就会收到影响，于是就开始各种尝试，将lazyload的class为lazy的div放进carousel插件的class为item的div内部，结果简直就是惊喜，效果看起来是实现了。于是就屁颠屁颠的上交自己的作品，让老大检查。结果就是再次被驳回，因为不符合需求，需求是优先加载第一屏，让页面刚打开的时候就能很快的完全显示，而自己做的是在页面加载完成之后才开始加载的banner。于是又是Try again。

再次理解了需求之后，这次要求不用插件，而是自己写代码。好吧，既然要自己写，就要在使用了carousel的前提下理清思路再开工。于是就将自己的思路写在纸上，没办法，都怪自己的空间逻辑思维能力不够用啊，所有只能借助纸笔了。首先，banner加载的时机就是carousel的滚动，而自己不能修改carousel.js，不能让它再出发滚动的时候就加载banner，但是滚动的触发对于代码的变化就是动态的给div移除和添加active 类，于是我就想只要是js操作active类的div以及它的下一个div加载图片就可以了，其他的div就不加载background-image。按照这个思路写好之写好之后，发现第一张和第二张banner已经加载好了，但是js只是执行了一遍，如何让它持续的检测active类并执行将data-original转换成background-image呢，于是就想到了setTimeout()和clearTimeout(),于是将data-original转换成background-image 的代码封装成函数用setTimeout()调用，我以为的效果是实现了，但是开销太大了，因为要不停的执行那段js，就算第一张已经将data-original转换成了background-image了之后还是会再次执行，于是我就在想clearTimeout的时机，就在active类的那个div和下一个div转换好之后就clearTimeout，但是问题又来了，使用了clearTimeout之后就真的结束了，就不会再次启动了，后面的banner还没有加载出来，怎么办呢？于是我又想有什么事件可以触发，然后执行setTimeout，为了找到这个我真的是绞尽脑汁啊 ，发现可以给轮播的那个小圆点添加click事件，这样在点击小圆点的时候就不会加载不出来图片，我就给li添加了click事件，点击小圆点触发执行setTimeout然后加载banner实现了，但是自动轮播的那个还是没有实现，怎么办呢？于是，再次开始绞尽脑汁，估计我的脑细胞真的是已经死伤无数了，但是又不能说自己做不出来，便开始了研究carousel 的文档，希望能够从中找到突破点，结果，皇天不负有心人啊，真的让我找到了，slide.bs.carousel事件，bootstrap上的描述是当调用 slide 实例方法时立即触发该事件，我一想，这不就是我一直苦苦追寻的吗？当然，答案是肯定的 。并且有了它之后我也不用在给小圆点上绑定事件了，也不用什么setTimeout了，这次真的是欣喜若狂，估计就和范进中举的心情是一样的，只不过我没有疯而已。这次的效果和我想要实现的效果是一样的，顿时，这么多天一直悬着的心终于落下了，不过事实证明我高兴的太早了。我将自己的成果给老大看，老大同样的问题问了我三遍，banner加载优化的需求是什么，目的是什么？当听到这句话的时候我简直蒙了，难道我的语文水平已经退化到幼儿园的地步了？，我又将我上面描述的说了一遍，都说再一再二不能再三，可是我。。。。多谢老大耐心的指导，感激不尽啊！遇到这样的小弟也是悲催啊。

经过指点，我发现我做的所有的效果都是在页面加载之后才加载的banner 。当时想的是js在页面的后面，按照浏览器的加载顺序，怎么着写js都是先加载页面后加载banner。我不知所措，请求指点，老大让我看了他做的，对比了线上的和自己的。我简直说不出话了，原来自己一直都在一个误区里，自己以为的延时加载就是要延迟将data-original 转换成background-image，而自己一直在做的工作同样也是这个，所以banner总是在页面加载完成之后在加载。

我原来没有觉得学习一项新的东西那么痛苦，我现在到了简直是要抓狂的节奏，难道是我原来学的东西都是不求甚解，所以才觉得简单？可能我原来只停留在会用的层面上，但是，对于现在的我来说会用根本不行。但是我还不能够放弃，当然一方面是因为我现在还要吃饭填饱肚子，我还没有达到羽化成仙的境界；另一方面是因为我不想以后还过着这样的日子。有时候我再想是不是其他行业就没有那么困难，我每次都在挣扎，可是我在想如果其他的行业也是这样的怎么办呢？难道我又要放弃再换其他的行业？那样的话我岂不是一事无成。有时候感到很委屈，莫名其妙的感觉委屈，不对，不应该说是委屈，是因为自己学不会而感觉自己很笨，自己跟自己生闷气的感觉。即使是这样，同样要每天没心没肺的开怀大笑。就权当是发泄一下喽。

刚看到指派的任务是lazy加载，当时并不知道这是什么东西，结果百度了一下，原来lazyLoad是一款插件，当时略微看了这款插件之后，就觉得这款插件应该应用于那种大量使用图片的网站，像淘宝啦 蘑菇街啦 美丽说啦之类的，当然，人家那些网站已经不屑于用这种小插件了，人家用的本身就是高大上的流式布局，但我实在是没有想到我们网站的首页的banner加载还要延时加载，瞬间有一种杀鸡用了牛刀的感觉。经过仔细的了解之后才明白图片加载还是很容易拖慢页面加载的进度的，或者这种拖慢在某种网速下看不出来，但是在网速比较差，或者信号不是很好的情况下就很明显。这才发现，原来老大一直都是在精益求精，而自己竟然有这种“差不多就可以了”观念，或许对于大多数人一开始都会有这种观点，后来人家经过脱变（我觉得是被逼的），成就了精益求精。同样，我也是被逼的，简直到了抓狂的地步，然后感慨一句，书到用时方恨少啊。

对比完之后瞬间感觉自己就像那个猪一样的队友，但是，蠢只是借口，不是原因。真正的原因是自己太属于行动派了，拿到任务就蒙着头开始干，缺少理性的分析，没有真正的理解就开始动手；第二就是自己太浮躁了，学东西还是留在表面，没有深入理解就开始使用，并以为自己会用就算是会了；第三，看东西不仔细，经常忽略掉一些东西。像我这种急性子的人，难道这就是传说中的性格缺陷？原来一直以为那些自己才是最大的敌人，战胜自己才是成功之类的话只是高谈阔论，原来是真的。

那问题又来了，我该怎么做呢？或许这个东西还真的得靠我自己。