-
style.left 返回的是字符串，如28px，offsetLeft返回的是数值28，如果需要对取得的值进行计算， 还用offsetLeft比较方便。查看全部
-
定义一个json｛｝通过for（var i in json）来遍历里面的值，使得属性可以同时变化。 注意：当json里的某个值到达目标时，就会停止定时器，此时需要对代码做出修改 json｛name/key｝查看全部
-
//最终封装的'完美移动框架' function startMove(obj,json,fn){ var flag=true;//标志所有运动是否到达目标值 clearInterval(obj.timer); obj.timer=setInterval(function(){ for(var attr in json){ var curr=0; //判断是否为透明度 if(attr=='opacity'){ curr=Math.round(parseFloat(getStyle(obj,attr))*100); }else{ curr=parseInt(getStyle(obj,attr)); } //移动速度处理 var speed=0; speed=(json[attr]-curr)/10; speed=speed>0?Math.ceil(speed):Math.floor(speed); if(curr!=json[attr]){ flag=false; } if (attr=='opacity') { obj.style.filter='alpha(opacity:'+(curr+speed)+")"; obj.style.opacity=(curr+speed)/100; }else{ obj.style[attr]=curr+speed+'px'; } } if(flag){ clearInterval(obj.timer); if(fn){ fu(); } } },30); } //取样式 function getStyle(obj,attr){ if(obj.currentStyle){//IE取样式 return obj.currentStyle[attr]; }else{ return getComputedStyle(obj,false)[attr]; } }查看全部
-
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]; } }查看全部
-
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]; } }查看全部
-
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、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]; } }查看全部
-
1、速度的定义： var speed=(目标值-当前值（offset）)/参数； 2、取整函数： 向下取整：Math.floor(3.55);//3.55是取整的数值，结果为：3 向上取整：Math.ceil(3.35);//结果为：4 3、速度的取整判断： speed=speed>0?Math.ceil(speed):Math.floor(speed);// 条件操作位 这个表达式的意思是如果speed大于0（关系表达式返回true），则将Math.ceil(speed)向下去整赋值给 speed，反之则将Math.floor(speed)向上去整赋值给 speed查看全部
-
多物体运动 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); } } };查看全部
-
方便的可以传到github之类的, 或者在线预览的, 要事先准备好, 并且保证在任何一个设备都可以访问使用(如果可以的话). 例如: 就职期间参与公司部产品开发, 负责服务器环境构建, 熟悉了redis, nginx在高并发环境下的应用,并运行3年内在线率达到98%. 或者 就职期间参与XXX网站开发, 并配合iOS研发部门开发了移动端站点, 运营期间不断完善, 学习了在移动端开发网站的相关技能(不要用相关, 列举出来).查看全部
-
Axure RP是一个专业的快速原型设计工具。Axure（发音：Ack-sure），代表美国Axure公司；RP则是Rapid Prototyping（快速原型）的缩写。 Axure RP是美国Axure Software Solution公司旗舰产品，是一个专业的快速原型设计工具，让负责定义需求和规格、设计功能和界面的专家能够快速创建应用软件或Web网站的线框图、流程图、原型和规格说明文档。作为专业的原型设计工具，它能快速、高效的创建原型，同时支持多人协作设计和版本控制管理[1] 。查看全部
-
1、速度的定义： var speed=(目标值-当前值（offset）)/参数； 2、取整函数： 向下取整：Math.floor(3.55);//3.55是取整的数值，结果为：3 向上取整：Math.ceil(3.35);//结果为：4 3、速度的取整判断： speed=speed>0?Math.ceil(speed):Math.floor(speed);查看全部
-
透明度： css定义（filter:alpha(opacity:30)） JS 改变： IE：style.filter=‘alpha(opactiy:’+值+')' 非IE .style.opactiy=值/100（火狐或者chrome关于透明度的满值1，IE是100） <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>无标题文档</title> <style> body,div{ margin:0; padding:0; } #div1{ width:200px; height:200px; background:red; filter:alpha(opacity:30); opacity:0.3; } </style> <script> window.onload = function(){ var oDiv =document.getElementById('div1'); oDiv.onmouseover=function(){ startMove(100); } oDiv.onmouseout=function(){ startMove(30); } } var timer = null; var alpha = 30; function startMove(iTarget){ var oDiv =document.getElementById('div1'); clearInterval(timer); timer=setInterval(function(){ var speed = 0; if(alpha>iTarget){ speed = -10; } else{ speed = 10; } if(alpha == iTarget){ clearInterval(timer) } else{ alpha+=speed; oDiv.style.opacity = alpha/100 } },30) } </script> </head> <body> <div id="div1"></div> </body> </html>查看全部
-
1、设置透明度的样式语句： filter:alpha(opacity:30);//30是透明度的值。 2、因没有获取当前透明度的属性，则需要定义一个变量alpha，对变量和目标进行比较，实现效果。 3、IE和获取浏览器透明度的赋值方法： IE：object.style.filter='alpha(opacity:'+值+')';查看全部
-
1、设置透明度的样式语句： filter:alpha(opacity:30);//30是透明度的值。 2、因没有获取当前透明度的属性，则需要定义一个变量alpha，对变量和目标进行比较，实现效果。 3、IE和获取浏览器透明度的赋值方法： IE：object.style.filter='alpha(opacity:'+值+')';查看全部
举报
0/150
提交
取消