小型门户网站有哪些,互联网运营推广公司,wordpress文章数据包,网络架构必须满足哪些特性加速运动#xff0c;即一个物体运动时速度越来越快#xff1b;减速运动#xff0c;即一个物体运动时速度越来越慢。现在用Javascript来模拟这两个效果#xff0c;原理就是用setInterval或setTimeout动态改变一个元素与另外一个元素的距离#xff0c;如xxx.style.left或xxx…加速运动即一个物体运动时速度越来越快减速运动即一个物体运动时速度越来越慢。现在用Javascript来模拟这两个效果原理就是用setInterval或setTimeout动态改变一个元素与另外一个元素的距离如xxx.style.left或xxx.style.marginLeft然后每次运动后都使速度增加这样加速运动的效果就出现了减速运动是同样的道理。下面是两个示例加速运动[html]Javascript加速运动* {margin: 0; padding: 0;}.div1 {width: 100px; height: 100px; background: #f60 url(qiuweiguan.gif) no-repeat center center;}var $$ function (id) {return document.getElementById(id);}window.onload function () {var oBtn $$(btn1);var oDiv $$(div1);var timer null;var speed 0;oBtn.onclick function () {clearInterval(timer);timer setInterval(function () {speed ;oDiv.style.marginLeft oDiv.offsetLeft speed px;}, 30);}}GO[/html]加速运动的示例演示及源码下载注本示例中点击GO后div块会一直向右做加速运动减速运动[html]Javascript减速运动* {margin: 0; padding: 0;}.div1 {width: 100px; height: 100px; background: #f60 url(qiuweiguan.gif) no-repeat center center;}var $$ function (id) {return document.getElementById(id);}window.onload function () {var oBtn $$(btn1);var oDiv $$(div1);var timer null;var speed 30;oBtn.onclick function () {clearInterval(timer);timer setInterval(function () {speed — ;oDiv.style.marginLeft oDiv.offsetLeft speed px;}, 30);}}GO[/html]减速运动的示例演示及源码下载注本示例中点击GO后div块会一直向右做减速运动直到速度减为零后速度变为负值再向左做加速运动
