課程
/前端開發
/JavaScript
/JS動畫效果
測試時候發現 實際偏移值 和 預期值 之間有一定偏差 為什么?
2016-11-25
源自:JS動畫效果 6-2
正在回答
function manyDivMove(obj,json,fn) {
clearInterval(obj.timee);
obj.timee = setInterval(function () {
var flag = true;//看這里 1
for(var attr in json){
var ico = 0;
if (attr=='opacity') {
ico = parseFloat(getStyle(obj,attr))*100;
}else{
ico = parseInt(getStyle(obj,attr));
}
var speed = (json[attr]-ico)/8;
speed = speed>0? Math.ceil(speed):Math.floor(speed);
if(json[attr]!=ico){
flag = false;//看這里 2
//obj.style.filter = 'alpha(opacity:'+(ico+speed)+')';
obj.style.opacity = ( speed + ico )/100;
obj.style[attr] = speed + ico+'px';
if (flag) {//同時動作做完了才清除定時器
if (fn) {fn(obj);}
},30);
添加一個 flag 來判斷是否所有同步的動作都做完了
慕虎8944357 提問者
舉報
通過本課程JS動畫的學習,從簡單動畫開始,逐步深入各種動畫框架封裝
3 回答flag值的改變?
4 回答要讓谷歌瀏覽器實現此特效怎么辦呢,這個特效我測試了只能用IE打開。
2 回答為什么我的當前值會比目標值差1px
1 回答谷歌瀏覽器動不了
2 回答寬度變化值不同?
Copyright ? 2025 imooc.com All Rights Reserved | 京ICP備12003892號-11 京公網安備11010802030151號
購課補貼聯系客服咨詢優惠詳情
慕課網APP您的移動學習伙伴
掃描二維碼關注慕課網微信公眾號
2016-11-25
function manyDivMove(obj,json,fn) {
clearInterval(obj.timee);
obj.timee = setInterval(function () {
var flag = true;//看這里 1
for(var attr in json){
var ico = 0;
if (attr=='opacity') {
ico = parseFloat(getStyle(obj,attr))*100;
}else{
ico = parseInt(getStyle(obj,attr));
}
var speed = (json[attr]-ico)/8;
speed = speed>0? Math.ceil(speed):Math.floor(speed);
if(json[attr]!=ico){
flag = false;//看這里 2
if (attr=='opacity') {
//obj.style.filter = 'alpha(opacity:'+(ico+speed)+')';
obj.style.opacity = ( speed + ico )/100;
}else{
obj.style[attr] = speed + ico+'px';
}
}
}
if (flag) {//同時動作做完了才清除定時器
clearInterval(obj.timee);
if (fn) {fn(obj);}
}
},30);
}
添加一個 flag 來判斷是否所有同步的動作都做完了