-
1、小数在计算机中表示存在误差（alert(0.07*100)）结果不是7；我们使用Math.round函数来解决； 2、Math(parseFloat(getStyle(obj,attr))*100)使用这样的方法来获取透明度alpha的当前值 3、获取当前透明度不用parseInt 4、设置透明度要考虑兼容 obj.style.filter='alpha(opacity:'+(当前透明度+变化速度)+')'; obj.style.opacity=(当前透明度+变化速度)/100; 5、透明度不加“px” 在使用parseInt()时处理透明度小数时,会有影响 单位设置 相应位置进行判断 IE/FireFox 取相应值 Math.round()四舍五入取整数值 Math.round(parseFloat(getStyle(obj,attr))*100)查看全部
-
<script type="text/javascript" src="js/jquery.min.js"></script> <script> $(function(){ $('#move a').mouseenter(function(){ $(this).find('img').animate({top:'-15px',opacity:'0'},300,function(){ $(this).css({top:'30px'}); $(this).animate({top:'15px',opacity:'1'},200) }) }) }) </script>查看全部
-
行间样式： 1.过程：obj.stlye.width是样式中的块width；而obj.offsetWidth是显示的width(包括border之类的)，故obj.style.width=obj.offsetWidth-1=obj.style.width+borderWidth-1,当borderWidth＞1时,其实这是在加宽度而不是减宽度; 2.原型为parseInt ( Strings,[int radix])，用于解析一个字符串，并返回一个整数。还有parseFloat,则解析一个字符串，返回一个浮点数; 3.用js的style属性可以获得html标签的样式，但是不能获取非行间样式。即： 用document.getElementById(‘element').style.xxx可以获取元素的样式信息，可是它获取的只是DOM元素style属性里的样式规则，为了实现结构样式分离，减少行内元素，可封装函数来获取CSS里定义的style。对于通过class属性引用的外部样式表，就拿不到我们要的信息了。所以js用currentStyle和getComputedStyle获取css的非行间样式； 4.offsetWidth返回的是oDiv的padding+border+width值之和； 获取样式方法： 1、dom.style.xxx 这种写法只能获取行内样式 例如 <div ></div> div.style.width能获取到是200px，但是没有出现在 引号中的样式是获取不到的 2、万能方法(为了获取样式而封装好的函数) getComputedStyle(obj,false)[attr] 这个是标准方法，需要做一下兼容 currentStyle 是IE的 3、友情赠送获取任何样式的代码 function getStyle(obj,attr){ if(obj.currentStyle){ return obj.currentStyle[attr]; }else{ return getComputedStyle(obj,false)[attr]; } }查看全部
-
多物体运动<br> for循环来为每一个TagNameList[i]添加事件，并添加属性来区分各自的定时器(用于取消)<br> 利用参数中的this来指定所选择的当前元素<br> 多物体不要共用一个值,在对象上定义一个单独的属性保存值<br> 多物体运动注意：定时器、变量要定义为个体的，而不能公用查看全部
-
move.js function startMove(obj,attr,iTarget,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]; } }查看全部
-
链式运动函数： 鼠标移开执行的动作 与 鼠标滑过的动作相反 。 window.onload = function(){ var oDiv = document.getElementById("div1"); oDiv.timer = null; oDiv.onmouseover = function(){ startMove(oDiv,'width',400,function(){ startMove(oDiv,'height',400,function(){ startMove(oDiv,'opacity',100); }); }); }; oDiv.onmouseout = function(){ startMove(oDiv,'height',200,function(){ startMove(oDiv,'opacity',30,function(){ startMove(oDiv,'width',200) }) }); }; };查看全部
-
Math.round()，四舍五入 设置透明度： 对IE浏览器：filter:alpha(opacity:30); 对其他浏览器：opacity: 0.3; startMove(this,'opacity',100),this指代这个Li1,opacity是参数，也可以是width或者height,100为目标值，透明度的目标值。 Li1.onmouseover=function(){ startMove(this,'opacity',100); } 用getStyle这个方法去获取样式比用setoffWidth,更加准备，getStyle(obj,'width');是获取属性值，setoffWidth是获取整个盒子的值。（加边框） function getStyle(obj,attr){ if(obj.currentStyle){ return obj.currentStyle[attr]; }else{ return getComputedStyle(obj,false)[attr]; } }查看全部
-
function startMove(obj,attr,iTarget){ clearInterval(obj.timer);//1.2+++ obj.timer=setInterval(function(){//1.2+++ var icur=null; if(attr=='opacity'){ icur=Math.round(parseFloat(getStyle(obj,attr))*100); }else{ icur=parseInt(getStyle(obj,attr)); } var speed=(iTarget-icur)/8; speed=speed>0?Math.ceil(speed):Math.floor(speed); if(icur==iTarget){ clearInterval(obj.timer);//1.2+++ }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]; } }查看全部
-
window.onload=function(){ var Li1=document.getElementById('li1'); var Li2=document.getElementById('li2'); Li1.onmouseover=function(){ startMove(Li1,'height',400); } Li1.onmouseout=function(){ startMove(Li1,'height',200); } Li2.onmouseover=function(){ startMove(Li2,'width',400); } Li2.onmouseout=function(){ startMove(Li2,'width',200); } } function startMove(obj,attr,iTarget){ clearInterval(obj.timer);//1.2+++ obj.timer=setInterval(function(){//1.2+++ var icur=parseInt(getStyle(obj,attr)); var speed=(iTarget-icur)/8; speed=speed>0?Math.ceil(speed):Math.floor(speed); if(icur==iTarget){ clearInterval(obj.timer);//1.2+++ }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]; } }查看全部
-
1.过程：obj.stlye.width是样式中的块width；而obj.offsetWidth是显示的width(包括border之类的)，故obj.style.width=obj.offsetWidth-1=obj.style.width+borderWidth-1,当borderWidth＞1时,其实这是在加宽度而不是减宽度; 2.原型为parseInt ( String s , [ int radix ] )，用于解析一个字符串，并返回一个整数。还有parseFloat,则解析一个字符串，返回一个浮点数; 3.用js的style属性可以获得html标签的样式，但是不能获取非行间样式。即： 用document.getElementById(‘element').style.xxx可以获取元素的样式信息，可是它获取的只是DOM元素style属性里的样式规则，对于通过class属性引用的外部样式表，就拿不到我们要的信息了。所以js用currentStyle和getComputedStyle获取css的非行间样式； 3.var style = window.getComputedStyle("元素", "伪类");第二个参数“伪类”（如果不是伪类，设置为null） (但是课堂里老师设置为false是何解？)查看全部
-
1、dom.style.xxx 这种写法只能获取行内样式 例如 <div ></div> div.style.width能获取到是200px，但是没有出现在 引号中的样式是获取不到的 2、万能方法。 getComputedStyle(div,null).xxx 这个是标准方法，需要做一下兼容 currentStyle 是IE的 3、友情赠送获取任何样式的代码 function getStyle(obj,style){ if(obj.currentStyle){ return obj.currentStyle[style]; }else{ return getComputedStyle(obj,null)[style]; } }查看全部
-
运动框架实现思路查看全部
-
多物体运动 for循环来为每一个TagNameList[i]添加事件 并添加属性来区分各自的定时器(用于取消) 利用参数中的this来指定所选择的当前元素 多物体不要共用一个值,在对象上定义一个单独的属性保持值 存在多项共用一个值，并且这个值会发生改变时，最好单独给赋值，避免出现争用的情况。 <script> window.onload=function(){ var aLi=document.getElementsByTagName('li'); for(var i=0;i<aLi.length;i++){ // 给每一个li设置一个timer，才不会致使他们去抢timer aLi[i].timer=null; aLi[i].onmouseover=function(){ startMove(this,400); }; aLi[i].onmouseout=function(){ startMove(this,200) } } var oDivLi=document.getElementsByTagName('div'); for(var j=0;j<oDivLi.length;j++){ oDivLi[j].timer=null; oDivLi[j].alpha=30; oDivLi[j].onmouseover=function(){ startMove1(this,100); }; oDivLi[j].onmouseout=function(){ startMove1(this,30); } } };查看全部
-
鼠标移入移出查看全部
-
在游戏编程中，通常使用一个变量(称为FLAG)来标记接下来的剧情走向，当玩家做出影响剧情的动作时，就改写这个变量的值，在剧情分支点则根据FLAG的当前值决定游戏程序运行的分支。查看全部
举报
0/150
提交
取消