2020年3月24日

轮播图效果

摘要：轮播图也称为焦点图，是网页中比较常见的网页特效。功能需求： 1.鼠标经过轮播图模块，左右按钮显示，离开隐藏左右按钮。 2.点击右侧按钮一次，图片往左播放一张，以此类推，左侧按钮同理。 3.图片播放的同时，下面小圆圈模块跟随一起变化。 4.点击小圆圈，可以播放相应图片。 5.鼠标阅读全文

posted @ 2020-03-24 23:06 彩虹更新中阅读(300) 评论(0) 推荐(0)

封装缓动动画函数

摘要： function animate(obj, target, callback) { // 需要先清除定时器，防止连续点击速度变快 clearInterval(obj.timer) obj.timer = setInterval(function() { if (obj.offsetLeft == t 阅读全文

posted @ 2020-03-24 21:49 彩虹更新中阅读(149) 评论(0) 推荐(0)

封装动画函数-匀速运动

摘要： <button>点击动画开始</button> <div></div> 注意一定要给div加定位，不然就没法移动了 div { position: relative; top: 0; left: 0; width: 100px; height: 100px; background-color: pi 阅读全文

posted @ 2020-03-24 10:50 彩虹更新中阅读(215) 评论(0) 推荐(0)

实现产品图片的放大镜效果：

摘要： <div class="product_intro container clearfix"> <div class="product_img"> <div class="product_img_1"> <div class="mask"></div> <div class="show_big"> < 阅读全文

posted @ 2020-03-24 09:41 彩虹更新中阅读(252) 评论(0) 推荐(0)

导航

2020年3月24日