#Javascript忍者秘籍

javascript的垃圾收集机制

  javascript具有自动垃圾收集机制,执行环境会负责管理代码执行过程中使用的内存。在编写javascript程序时,开发人员不用再关心内存使用问题,所需内存的分配以及无用内存的回收完全实现了自动管理。下面将详细介绍javascript的垃圾收集机制 原理  垃圾收集机制的原理很简单:找出那些不再继续使...

javascript中15种原生对象类型系统综述

  在编程语言中,能够表示并操作的值的类型称做数据类型,编程语言最基本的特性就是能够支持多种数据类型。javascript拥有强大的类型系统,主要包括原生对象、宿主对象和浏览器拓展对象,本文主要介绍15种原生对象类型系统 原生对象(15种)  原生对象分为两类:原始类型(primitivetype)和对象类型...

javascript运动系列第九篇——碰撞运动

  碰撞可以分为碰壁和互碰两种形式,上篇介绍了碰壁运动,本文将从浅入深地介绍碰撞运动的互碰形式 碰撞检测  对于互碰形式的碰撞运动来说,首先要解决的是碰撞检测。对于矩形元素的碰撞检测前面的博文已经详细介绍过,下面主要介绍圆形元素的碰撞检测  矩形元素的碰撞检测利用九宫格分析法,而圆形元素的碰撞检测则简单很多,...

javascript运动系列第八篇——碰壁运动

  碰撞运动可能是运动系列里面比较复杂的运动了。碰撞可以分为碰壁和互碰两种形式,而碰撞前后的运动形式也可以分为变速和匀速两种,如果再涉及到阻力,具有速度损耗的话,就更加复杂了。本文先介绍碰壁运动 匀速碰壁  碰壁是一种常见的碰撞形式,匀速碰壁是最简单的碰撞运动  假设一个密闭空间内一个弹性小球,小球有一个随机...

javascript运动系列第七篇——鼠标跟随运动

  运动除了直线运动和曲线运动两种运动形式外,还有一种运动形式是鼠标跟随运动,而这种跟随运动需要用到三角函数的相关内容或者需要进行比例运算。本文将以几个小实例来介绍鼠标跟随运动的相关内容 眼球转动  在很多网页中,都存在着跟随运动,比如眼球转动。鼠标在网页中移动时,眼球也会跟着朝相应方向转动  上面是眼球转动...

javascript运动系列第六篇——轨迹和投掷

  一般地,不同的运动形式会产生不同的轨迹。但仅凭肉眼去识别运动轨迹,其实并不是很直观。因此,在页面中显示运动轨迹,是一个重要的问题。物体初始态时,受到外力大小不同,则初速度不同。如何在网页中模拟投掷效果,也需要解决。接下来,将详细介绍轨迹和投掷 运动轨迹  元素在运动过程中,不同的运动形式会产生不同的轨迹。...

javascript运动系列第五篇——缓冲运动和弹性运动

  缓冲运动指的是减速运动,减速到0的时候,元素正好停在目标点。而弹性运动同样是减速运动,但元素并不是直接停在目标点,而是在目标点附近弹几下再停止。本文将以一种新的思路来详细介绍缓冲运动和弹性运动 缓冲运动  在变速运动中,曾经用物理学的知识实现过缓冲运动。缓冲运动实际上就是减速运动的一种特殊形式,指元素做减...

javascript运动系列第四篇——抖动

  在运动系列中,前面分别介绍了匀速运动、变速运动和曲线运动。下面介绍一种特殊的运动形式——抖动 原理介绍  抖动其实是往复运动的一种特殊形式,只不过往复运动是一种无摩擦力的无限运动,且以速度为参照依据;而抖动以位置作为参照依据,最终停在起始点  在网页中最常见的一种抖动效果应该是窗口...

javascript运动系列第三篇——曲线运动

  上一篇介绍了变速运动,但只实现了直线运动。如果元素的left和top同时运动,并遵循不同的曲线公式,则会进行不同形式的曲线运动。本文将详细介绍圆周运动、钟摆运动、抛物线运动和流体运动这四种曲线运动形式 圆周运动  圆周运动可能是最好理解的曲线运动了  若(x0,y0)为圆心,则圆的公式为(x-x0)*(x...

javascript运动系列第二篇——变速运动

  前面介绍过匀速运动的实现及注意事项,本文在匀速运动的基础上,更进一步,实现各种变速运动,包括加速运动、减速运动、缓冲运动、重力运动和弹性运动 准备工作匀速运动  在原生javascript中实现运动的主要工具是定时器,通过设置固定的间隔时间,使元素在确定的间隔时间内实现距离的变化。而运动变化的主要表现形式...

javascript运动系列第一篇——匀速运动

  除了拖拽以外,运动也是javascript动画的一个基本操作。通过CSS属性transition和animation可以实现运动。但是,要进行更精细地操作,javascript运动是必不可少的。本文将详细介绍javascript运动 简单运动  让一个元素在页面中运动起来很简单,设置定时器,改变定位元素的...

javascript动画系列第五篇——模拟滚动条

  当元素内容溢出元素尺寸范围时,会出现滚动条。但由于滚动条在各浏览器下表现不同,兼容性不好。所以,模拟滚动条也是很常见的应用。本文将详细介绍滚动条模拟 原理介绍  滚动条模拟实际上和元素模拟拖拽类似。仅仅通过范围限定,使元素只可以在单一方向上拖拽<divid="box"style="height:20...

javascript动画系列第四篇——拖拽改变元素大小

  拖拽可以让元素移动,也可以改变元素大小。本文将详细介绍拖拽改变元素大小的效果实现 原理简介  拖拽让元素移动,是改变定位元素的left和top值实现的。而拖拽改变元素大小,则还需要改变元素的宽高 范围圈定  我们把改变元素大小的范围圈定在距离相应边10px的范围内  左侧边界L=obj.offs...

javascript动画系列第三篇——碰撞检测

  前面分别介绍了拖拽模拟和磁性吸附,当可视区域内存在多个可拖拽元素,就出现碰撞检测的问题,这也是javascript动画的一个经典问题。本篇将详细介绍碰撞检测 原理介绍  碰撞检测的方法有很多,接下来使用九宫格分析法  假设黄色元素要与红色元素进行碰撞。将红色元素所处的区域分为9部分,自身处于第9部分,周围...

javascript动画系列第二篇——磁性吸附

  上一篇,我们介绍了元素拖拽的实现。但在实际应用中,常常需要为拖拽的元素限定范围。而通过限定范围,再增加一些辅助的措施,就可以实现磁性吸附的效果 范围限定  如果我们限定元素只可以在可视范围内移动,那么就需要对其进行范围限定  首先,先要搞清楚是可视区域限定被拖拽元素  左侧范围L0=0  右侧范围R0=d...
首页上一页...6263646566...下一页尾页