愚小子 - 博客园

关于网页上图片无缝滚动的一些思路

摘要：从现在的一些常见网站上，无缝滚动的例子用得非常普遍，可以说很常见，也比较实用，下面我们就来简单看看，具体的一些想法怎么实现的：先简单来看一下原理：首先我们看到网页上一组图片不停滚动，一次循环之后又从第一张开始，其实简单的思路是：我们设置两组图片，当第一组图片滚动到结尾时，对应的第一组图片又瞬间拉阅读全文

posted @ 2016-09-23 20:18 愚小子阅读(1667) 评论(0) 推荐(0) 编辑

一个小例子，小图切换大图

摘要：小图切换大图是很常见的一个网页效果，这里我用前面的运动框架自己写了个小例子，提供一些思路： <!DOCTYPE html><html><head> <meta charset="utf-8"> <title></title> <style type="text/css"> *{ margin: 0; 阅读全文

posted @ 2016-09-21 09:15 愚小子阅读(344) 评论(0) 推荐(0) 编辑

关于完美框架的一些优化

摘要：上面那个完美框架基本能实现一些功能，但还有一些缺陷，比如我们来看一下这个，加入原有的样式为 #div1{ width:100px; height: 100px; background:green;},如果后来要设置为比较特殊的情况，比如 { width: 200, height: 105,backg 阅读全文

posted @ 2016-09-21 09:00 愚小子阅读(258) 评论(0) 推荐(0) 编辑

关于完美运动框架的一些思路

摘要：前面介绍了几个运动框架，但在实际中，有时不想运动一个接一个，而是希望多个属性同时变化，这时上面的那几个框架可能需要做出一些调整，这里我们又要接触一个比较实用的方法，就是json，json有点类似于数组，可以存储多个值，而且能进行遍历,如： var oJson = { a:12,b:15,c:20}; 阅读全文

posted @ 2016-09-21 00:11 愚小子阅读(1129) 评论(0) 推荐(0) 编辑

链式运动的一些思路

摘要：前面的一些运动都是只完成一种运动，完成后一般就不会在增加其他运动，在实际中可能会有多种情况，如果想要一个对象完成一个运动后，再接着完成另外一个运动，这时可以考虑用链式运动框架实现一些功能，最主要的还是在定时器封装的函数里再增加一个参数作为传值，一般这个参数是函数，下面这个小例子： function 阅读全文

posted @ 2016-09-20 23:41 愚小子阅读(386) 评论(0) 推荐(0) 编辑

多物体多种样式的运动简略分析

摘要：上面忘了介绍多物体的多种样式的运动，比如让一个物体宽度，另外一个的高度或者透明度发生改变，这样用单个运动框架就不能实现，我们在函数体类再传入一个参数，指定需要改变的样式，这样基本能实现功能需要，下面还是通过一个小例子来简要说明一下： <!DOCTYPE html><html><head> <meta 阅读全文

posted @ 2016-09-18 12:36 愚小子阅读(266) 评论(0) 推荐(0) 编辑

多物体中添加透明度的显示

摘要：前面展示了多物体的运动形式，但很常见的针对透明度没有考虑在内，透明度的展示用上述运动框架展示时，需要特别考虑一下，因为透明度是数值，并且有多个值，下面就见要探讨一下这个怎么展现出来： <!DOCTYPE html><html><head> <meta charset="utf-8"> <title> 阅读全文

posted @ 2016-09-18 12:02 愚小子阅读(118) 评论(0) 推荐(0) 编辑

简要说明一下offsetWidth的替换

摘要：前面几个例子中用到了offsetWidth这个属性，其实还有offsetTop,offsetHeight,offsetLeft等一些属性，总的来说这些都可以表示当前对象的一些属性值，可是在某些情况下，就可能引发一些不必要的问题，比如就offsetWidth来说，当用这个属性来获取目标的宽度时，当不给阅读全文

posted @ 2016-09-17 16:29 愚小子阅读(1181) 评论(0) 推荐(0) 编辑

多物体的运动，实现切换

摘要：上面一篇简要指明了多物体的淡入淡出，主要是把握定时器的用法与参数及速度的处理，这篇介绍一下多个物体的运动，和单个物体的运动有点区别。下面是写一些简要代码： <!DOCTYPE html><html><head> <meta charset="utf-8"> <title></title> <sty 阅读全文

posted @ 2016-09-17 15:56 愚小子阅读(163) 评论(0) 推荐(0) 编辑

多物体的淡入淡出，多物体运动框架

摘要：上面一个小例子展示了一张图片的淡入淡出，但实际情况可能有多个物体，在不同的物体之间进行切换，其实原理一样，只是添加多个不同的参数，控制定时器的开启与关闭，下面来展示在多个div之间来回切换，实现淡入淡出。 <!DOCTYPE html><html><head> <meta charset="utf- 阅读全文

posted @ 2016-09-17 15:10 愚小子阅读(242) 评论(0) 推荐(0) 编辑