摘要： 倒计时经常会在项目中或者电商类网站比如团购或者拼单等等中会有出现，今天就了解一下它的原理，然后写一个简单的倒计时例子。 其实关于倒计时原理很简单：就是用未来的时间减去去现在的时间然后换算即可。（未来的时间点（不变）减现在的时间点（在变））。 来看简单的例子：计算一下距离今年五一还有多长时间？ 直接来 阅读全文

摘要： 今天写一个时间例子，用图片组成时分秒。具体来看代码，当然今天的写法只是一种，还有很多种实现方法，来看布局： 先默认放上第一张图片，我是提前把图片标号序号从0-9，然后这样依次读取。js代码如下： 效果图如下： 最后一个数字是一直循环的效果，因为截不了gif图，所以这里说下了，你们可以拷贝代码试试看！ 阅读全文

摘要： 关于时间日常项目中可能会有很多需求，今天就写一个最简单的，将系统时间写入到页面上。直接来看js代码： 这样就可以了，具体该注意的地方在注释上已经写清楚了。最简单的写法希望对大家有帮助！ 阅读全文

摘要： 关于swiper图片切换有很多类型，我就不一一介绍了，可以直接到官网查询，今天来写一个适配于页面正中间的图片切换，也同时适配于任何图片的大小（也就是这个图片切换不用限制图片的本身大小，特别是移动端动态获取的图片有可能大小不一致），所以无论任何图片若是都想让其一直处于移动页面的正中间的话，那么就要获取 阅读全文

摘要： 昨天把多组图片抖动效果实现了，但是有一个问题就是关于快速多次移动到图片上的时候会出现移动事件结束之后图片不在原来位置。就像下图所示： 这个问题的关键是：获取的位置都是移动事件之后重新刷新的位置，所以又去加抖动频率，重新又实现一次抖动效果，以便于会有图片最后出现上图的问题了。解决这个关键就是要做个判断 阅读全文

摘要： 昨天提到了单个图片的抖动效果，那么今天来写一下多组图片实现抖动效果的封装，这种效果也许在日常的项目中会用到，简单封装一下，就不用每次都写差不多一样的代码了，好的来看html和css的布局，其实很简单就是两张图片： js代码如下： 好了，就是这样了，我写的比较啰嗦，也是希望看的比较明白，这只是两张图片 阅读全文

摘要： 今天来写一个关于图片抖动的效果，需求是：点击图片，让其抖动几下停止（类似于苹果手机填错密码之后会抖一下的效果），其实想要实现这个效果，原理就是，点击之后，让其左移动下然后右移动一下（每移动一下减几像素知道减到0），然后将其放入定时器内，让其慢慢自动停下来。来看代码布局： 接下来就是js的实现： 这样 阅读全文

摘要： 今天写一个简单的小例子，需求：页面有多个div，点击屏幕，div有顺序的依次下来。 来看js代码： 效果图如下： 好了，今天就这样！ 阅读全文

摘要： 今天还是来说昨天的小例子，昨天实现的效果就是点击按钮“向前”即往前相反则往后，那么需要细化的几个问题就是：代码可以简化以及可以用一个变量来控制方向直接来看js： 这是昨天的例子简化之后的代码，接下来看看怎么添加回调函数，那么昨天的布局就要稍微改动一下，用一个按钮来控制： 那么js代码是： 这个例子是 阅读全文

摘要： 昨天的例子是针对只有单个函数运行的结果，但是实际中可能会有多组函数这样同时进行，那么这个时候就要对函数进行封装传参，来实现效果了。就还拿昨天的例子来说吧，昨天写的例子实现的效果是点击按钮，让div向前移动，那么今天就扩展一下，点击按钮让div向后移动，想要实现这个效果，就必须要传参了，来看代码： 那 阅读全文