![](https://img-blog.csdnimg.cn/20201014180756919.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
jquery案例
cqj0008
这个作者很懒,什么都没留下…
展开
-
jquery 无缝轮播
思路: 先静态布局,设置一个变量为下标,利用jquery的选择器获取点击的所有li,获取宽,再写上下页的封装函数(进行下标的++,根据当前的下标判断是不是最后一张,(做一些动画效果,先停止动画一次),最后一张就把下标设置为0;跳到第一张,不是最后一张,根据left值改变图片的显示); 获取所有点击的li,添加点击事件,先清空所有,获取当前的下标,根据下标添加类名,再添加一个切换的动画(先停止一次)1原创 2017-12-16 12:16:20 · 163 阅读 · 0 评论 -
事件委托
委托事件 1.事件委托: 获取父元素,on事件,click事件,子元素,回调函数里面写需要委托的代码html部分: <ul> <p>12321321</p> <li class="active"></li> <li></li> <li></li> <li></li> <li></li>原创 2017-12-17 14:44:10 · 262 阅读 · 0 评论 -
懒加载
懒加载 原理: 先把所有的图片的src设置多一个_src,(不显示); 封装一个函数,获取总高度(窗口高 + 滚动的高度),所有的图片each循环index下标,ele元素, 元素需要包装为jq对象,获取这个元素图片的绝对位置(offset().top); 再判断元素图片的绝对位置小于或等于窗口加滚动的高度,先获取图片的_src,再设置src; 前面先调用一次,在滚动或者窗口大小发生变化时原创 2017-12-17 14:48:34 · 141 阅读 · 0 评论 -
吸顶条
吸顶条 1.现获取元素的绝对位置; 2.在滚动的事件,获取滚动的高度,判断滚动的高度大于等于元素的绝对位置时,元素设置固定定位,反之为静态的 3.设置一个相同的div元素,当固定定位的时候显示,反之隐藏;js部分: <script type="text/javascript" src='jq1.7.2/jquery.js'></script> <script type="text原创 2017-12-17 14:53:04 · 249 阅读 · 0 评论