摘要： 前面两篇都是做了一些关于缓动动画的基础，现在，可以在前面的基础上真正的封装缓动动画了。 单值传入 上面贴出来的是我们前面做的实验，因为我们是让元素左右移动，改变的是元素距离左边边框的距离，那么，如果我们需要让元素上下移动，就需要改变元素距离上边框的距离，如果要改变元素的大小，就需要改变元素的宽高，也 阅读全文

摘要： 动态设置元素属性 在前面一篇，我们实现了简单的运动共用，无论向左还是向右运动，改变的都是元素距离左边框的距离，如果我们想要元素向上移动，或者改变元素的宽度、高度，前面的方法变不再适用了。 前面我们通过传入值，并将值赋给offsetLeft属性，就可以改变元素的位置，实现动画效果。如果我们要元素上下移 阅读全文

摘要： 在前面有多次用到了定时器来生成动画，通常的做法是已知其实值和结束值，给出了运动步长即可，如下所示： 在上面的例子中，目标值是右移动400px，我们给出步长后，通过定时器为元素赋值，让其运动起来，但在实际运动中，我们通常的运动除了上面的向右移动，还有向左，向上或者其他的运动，这时，我们需要将上面的代码 阅读全文

摘要： 在平时阅读文章的时候，经常会碰到喜欢的文字段落，想要复制或者转达，今天就要来模拟一个获取用户选中文的文字的展示效果，具体如下： 用户选中一段文字后，获取到用户选中的文字，并展示出来，我们先来分析一下实现思路。 一段用来展示文字 一个用来放置选中文字的容器 获取选中的文字并显示 点击非文字部分，取消展 阅读全文

摘要： 在做自适应布局的时候，我们常常需要根据窗口不同的分辨率给出不同布局和样式，今天说的onresize便能帮我们实现这一效果。 onresize事件在窗口或者框架的大小发生改变的时候会被调用，下面我们用一个例子来演示。 在这个例子中，我们想要实现的效果是：当屏幕宽度小于500时，页面的背景色为灰色；当屏 阅读全文

摘要： 在前面总结了offset家族属性和scroll家族属性，今天来总结一下client家族属性，同前面一样，client家族也包宽高和左上，具体的通过代码来区别这三大家族属性的不同。 在上面的例子中，我们定义了一个内容超出，出现滚动的div，并了区分，添加了较大的边框和边距，下面是不同家族的打印结果： 阅读全文

摘要： 返回顶部也是一个常见的效果，主要是在浏览较长的网页是，方便用户快速的回到顶部。 首先是一个有滚动效果的长网页 在上面的页面结构中，我们用span元素添加了一个返回顶部按钮，因为在默认的初始化效果中，浏览器是置顶的，所以该按钮是隐藏的。 接下来分析要实现的返回顶部效果。 要实现这个效果，需要分三步： 阅读全文

摘要： 我们在写页面的时候，常见的侧边横幅广告是通过position：fixed实现的，这样定位的好处是无论主体内容怎么变化，侧边的位置永远保持不变，当然，这也是这种效果的弊端，网页效果死板单一，所以，我们今天就要为这种侧边横幅添加一个动画效果。 具体的实现思路是，也是通过定位，但不是position：fi 阅读全文

摘要： 本次要实现的是一种常见的网页效果，如下： 页面由头部，导航，主体内容三部分组成，当页面发生滚动时，头部逐渐隐藏，导航部分向上移动，直到导航部分距离浏览器顶部为零时，导航部分固定不动，保持吸顶效果，如下所示： 我们分三步实现上面的效果。 首先是页面的基础结构，为了简化操作，将头部、导航部分和主体内容部 阅读全文

摘要： 上一篇主要分析了一下offset家族属性，本篇文章则主要是来分析一下scroll家族属性。 首先，scroll家族包括4个属性： 网页正文宽度：document.body.scrollWidth; 网页正文高度：document.body.scrollHeight; 网页被卷去的高：document 阅读全文