亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

為了賬號安全,請及時綁定郵箱和手機立即綁定

JS動畫效果

vivian Web前端工程師
難度初級
時長 2小時 8分
學習人數
綜合評分9.60
537人評價 查看評價
9.8 內容實用
9.6 簡潔易懂
9.4 邏輯清晰
  • flag 標志變量定義沒搞懂
    查看全部
  • <!doctype html> <html> <head> <title></title> <meta charset='UTF-8'/> <style type='text/css'> *{ padding:0; margin:0; } #div1{ width:200px; height:100px; background:red; } </style> <script> window.onload=function(){ var oDiv=document.getElementById('div1'); oDiv.onmouseover=function(){ startMove(1000); } oDiv.onmouseout=function(){ startMove(100); } var timer=null; function startMove(iTarget){ clearInterval(timer); timer=setInterval(function(){ var speed=0; if(iTarget>200){ speed=10; }else{ speed=-10; } if(oDiv.offsetWidth==iTarget){ clearInterval(timer); }else{ oDiv.style.width=oDiv.offsetWidth+speed+'px'; } },30); } } </script> </head> <body> <div id='div1'></div> </body> </html>
    查看全部
    1 采集 收起 來源:JS速度動畫

    2018-03-22

  • currentStyle getComputedStyle
    查看全部
    0 采集 收起 來源:獲取樣式

    2016-01-17

  • .offsetleft獲取當前對象的left屬性值
    查看全部
    0 采集 收起 來源:JS速度動畫

    2016-01-15

  • JSON格式: var json = {name:key,name,key,...} for(var i in json){ alert(i); //遍歷name alert(json[i]); //遍歷key }
    查看全部
  • 鏈式運動需要底層框架
    查看全部
    0 采集 收起 來源:同時運動

    2016-01-14

  • 鏈式動畫!在運動函數中用if(cur==target){clearInterval(obj.timer) if(fn){ fn(); } }
    查看全部
    0 采集 收起 來源:JS鏈式動畫

    2016-01-14

  • 1、獲取當前透明度不用parseInt 2、設置透明度要考慮兼容 obj.style.filter='alpha(opacity:'+(當前透明度+變化速度)+')'; obj.style.opacity=(當前透明度+變化速度)/100; 3、透明度不加“px” 在使用parseInt()時處理透明度小數時,會有影響 單位設置 相應位置進行判斷 IE/FireFox 取相應值 Math.round()四舍五入取整數值 Math.round(parseFloat(getStyle(obj,attr))*100)
    查看全部
  • JSON格式: var json = {name:key,name,key,...} for(var i in json){ alert(i); //遍歷name alert(json[i]); //遍歷key }
    查看全部
  • 添加透明度的時候比較特殊。
    查看全部
  • 添加透明度: filter:alpha(opacity:30); opacity:0.3;
    查看全部
  • parseInt(getStyle(obj,'width'));
    查看全部
  • 獲取樣式:
    查看全部
    0 采集 收起 來源:獲取樣式

    2016-01-13

  • 獲取樣式兼容性寫法 if(obj.currentStyle){return obj.currentStyle[attr]}else{return getComputedStyle(attr,false)[attr]} offset 做運動計算時存在內外 邊距 或者邊框 影響計算 offsetwidth 不等于width
    查看全部
  • offsetwidth:是元素相對父元素的偏移寬度。等于border+padding+width 而width僅僅是自身的寬度 獲取樣式,解決兼容性 //obj 節點對象 //attr 屬性名 // function getStyle(obj,attr){ // if (obj.currentStyle) { // return obj.currentStyle[attr]; // } else{ // return getComputedStyle(obj,false)[attr]; // }; // }
    查看全部
    0 采集 收起 來源:獲取樣式

    2016-01-13

舉報

0/150
提交
取消
課程須知
1.您至少已經具備JavaSript的知識。2.您已經具備一些開發經驗。
老師告訴你能學到什么?
1.使用定時器實現簡單動畫。2.如何一步步封裝庫。2.培養編程的思想。

微信掃碼,參與3人拼團

微信客服

購課補貼
聯系客服咨詢優惠詳情

幫助反饋 APP下載

慕課網APP
您的移動學習伙伴

公眾號

掃描二維碼
關注慕課網微信公眾號

友情提示:

您好,此課程屬于遷移課程,您已購買該課程,無需重復購買,感謝您對慕課網的支持!