-
缓冲效果： opacity：所有浏览器都支持opacity属性。 注释：IE8以及更早的版本支持替代的filter属性。 如：filter:Alpha(opacity=50) 缓冲运动的速度值一定要转换成整数，不然将到达不了终点，是用Math.ceil()还是Math.floor()要看就提情况 动画大致模版（思路）： <script type="text/javascript"> var timer=null; function startMove (iTarget) { clearInterval(timer); var obj=document.getElementById('obj'); timer=setInterval(function () { var speed=0; if(obj.属性>iTarget){ spped=-num; } else{ speed=num; } if(obj.属性==iTarget){ clearInterval(timer); } else{ obj...=obj.属性+speed... } }, 毫秒)} </script>查看全部
-
js动画中有匀速和缓冲动画和透明度的变化: （一）匀速运动: 运动特效的视线，主要是通过定时器setInterval（）和clearInterval（）方法实现，在编程中，一要注意为防止计时器的叠加，叠加的效果就是速度不是匀速而是越来越快!所以开始都要清除一下定时器②注意function函数中的参数越少越好，所以可以在函数中定义变量可以显示。 （二）透明度的变化:透明度的变化和匀速变化的编程代码类似 （三）缓冲变化:注意由于是缓冲变化，所以在编写中的速度判断正负值，小于0要记得向下取整Math.floor（）和大于0向上取整Math.ceil（） （四）多个物体进行缓冲或者是透明度变化的时候，由于存在多个物体，所以为了指向当前所在的物体，实参使用this来视线，相对函数的形参使用obj来视线，当存在多个物体时，不能定义一个变量，这样子编辑器会产生争抢的情况，所以应该一个物体定义一个变量，即obj.attribute来实现。查看全部
-
IE浏览器使用currentStyle火狐浏览器使用getComputedStyle查看全部
-
获取样式:当把盒子的模块添加边框的时候，若实现缩小的效果的时候，减少的速度小于宽度大小的时候，会出现错误，即宽度是一直增加而不是减小的，这时候使用parseInt（）并且里面获取的style.attr而不是当前offset.attr，并且使用getStyle函数来获取样式，注意考虑到浏览器的兼容，查看全部
-
js动画中有匀速和缓冲动画和透明度的变化: （一）匀速运动: 运动特效的视线，主要是通过定时器setInterval（）和clearInterval（）方法实现，在编程中，一要注意为防止计时器的叠加，叠加的效果就是速度不是匀速而是越来越快!所以开始都要清除一下定时器②注意function函数中的参数越少越好，所以可以在函数中定义变量可以显示。 （二）透明度的变化:透明度的变化和匀速变化的编程代码类似 （三）缓冲变化:注意由于是缓冲变化，所以在编写中的速度判断正负值，小于0要记得向下取整Math.floor（）和大于0向上取整Math.ceil（） （四）多个物体进行缓冲或者是透明度变化的时候，由于存在多个物体，所以为了指向当前所在的物体，实参使用this来视线，相对函数的形参使用obj来视线，当存在多个物体时，不能定义一个变量，这样子编辑器会产生争抢的情况，所以应该一个物体定义一个变量，即obj.attribute来实现。查看全部
-
实现框架查看全部
-
Math.round()函数，进行四舍五入； 如果功能相似的话，可以往函数里再传一个参数，省去多余的代码，精简； 透明度只是一个数值，不需要加单位。查看全部
-
<script> $(function(){ $('#bianming a').mouseenter(function(){//Jquery去掉on $(this).find('i').animate({top:'-15px',opacity:'0'},300,function(){ $(this).css({top:'25px'});//animate和css里面必须加中括号{}，属性值必须加引号 $(this).animate({top:'15px',opacity:'1'},200); }) }) })//300表示速度，以毫秒为单位，也可用非数值的"slow"、"fast"等表示查看全部
-
获取stylede 方法查看全部
-
<script> window.onload=function(){ var aList=document.getElementsByTagName('a'); for(var i=0;i<aList.length;i++){ aList[i].onmouseenter=function(){ var _this=this.getElementsByTagName('i')[0]; move(_this,{top:-15,opacity:0},function(){//注意top后面不要带px _this.style.top=25+'px';//为了图标回来的时候是从下面回来.这里必须用+来连接字符串 move(_this,{top:15,opacity:100}) }) } } } // 由于onmouseover事件冒泡，所以当鼠标在a标签内不断移动（不出a标签的范围）会不断碰到a标签内的子元素，事件再冒泡到a,使得不断出发a.onmouseover事件，结果就是里面的小图片不停地动，改成onmuseenter,这个事件不冒泡或者写代码取消onmouseover的冒泡。 </script>查看全部
-
1、flag=true，应该立在定时器内，json的for遍历前； 2、if（flag）{clearInterval(obj.timer);if(fn){fn()}}应该放在定时器内，json的for遍历后； 因为当三个iCur==json[attr]，flag==false，之后一次执行定时器时，会将flag变为true，则变成true状态，for遍历中的结果并不会被执行，等于空运行一次for遍历后，true被带到if（flag）{if(fn){fn()}}，中执行关闭定时器和fn（）,如果吧if（flag）{...}放在for遍历中，最后fn（）会被执行三次，for遍历的特性查看全部
-
Ps1：/*JSON格式：*/ var json={a:0};//键值对{name:key} var json={a:0,b:1};//键值对{name1:key1,name2:key2}，多对 Ps2：/*for-in（for-each）*/ for(var i in json){ alert(i);//name值 alert(json[i]);//key值查看全部
-
链式动画，在startMove(obj,attr,iTarget,fn)再加一个fn参数，并在清除动画之后，加入fn方法：if(fn){fn();} 在主页中，在三个参数之后再加入一个参数 startMove(Li,'width',400,function(){ startMove(Li,'height',200,function(){ startMove(Li,'opacity',100); }) }) function startMove(obj,attr,iTarget,fn){ //添加一个回调函数fn clearInterval(obj.timer);//1.2+++ obj.timer=setInterval(function(){//1.2+++ var icur=null; //1.判断类型 if(attr=='opacity'){ icur=Math.round(parseFloat(getStyle(obj,attr))*100); }else{ icur=parseInt(getStyle(obj,attr)); } //2.算速度 var speed=(iTarget-icur)/8; speed=speed>0?Math.ceil(speed):Math.floor(speed); //3.检测停止 if(icur==iTarget){ clearInterval(obj.timer); if(fn){ //判断是否存在回调函数,并调用 fn(); } }else{ if(attr=='opacity'){ obj.style.filter='alpha(opacity:'+(icur+speed)+')'; obj.style.opacity=(icur+speed)/100; }else{ obj.style[attr]=icur+speed+'px'; } } },30); } function getStyle(obj,attr){ if(obj.currentStyle){ return obj.currentStyle[attr]; }else{ return getComputedStyle(obj,false)[attr]; } }查看全部
-
获取行内属性，并做兼容处理查看全部
-
获取行内属性，并做兼容处理查看全部
举报
0/150
提交
取消