发表于: 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变量保存,方便后面的调用。
评论