发表于: 2018-05-25 22:12:16

1 532


一、今天完成的事情

1、用js实现了轮播图滑入滑出的效果。用jquery分别获取要滑动的两个item,要分为两种情况,即向左滑动和向右滑动两种,第一张图向第二张图滑动,第二张图向第三张图滑动是向左滑动,第三张图向第一张图滑动是向右滑动。

对于向左滑动,当前item用jquery的animate的fadeOut,从left:0滑动到left:-item_width,而要滑入的item用fadeIn,从left:100%滑动到left:0

对于向右滑动,当前item从left:0滑动到left:100%,要滑入的item从left:-100%到left:0 。

最后对两个item添加和删除对应的class即可。

而下方圆点的滑动则是对应的添加删除active类即可。


二、明天计划完成的事情

1、继续任务14,同时解决存在的问题。


三、遇到的问题

1、滑动的时候仔细观察,边缘会有一条小白缝,估计是因为两条animate异步语句执行有一个小时差导致的。明天查询一下如何同步执行两条异步语句。


四、收获

1、熟悉了jquery的dom操作,当通过$('.class')获取到多个dom的时候,用[i]获取到的是html的tag,需要在外面再包一层$()才能用jquery的各种函数。使用时最好用一个var变量保存,方便后面的调用。


返回列表 返回列表
评论

    分享到