jQuery。動畫寬度在IE7/IE8中不起作用

我正在開發一個有彈出式計算器的網站。點擊按鈕「引用計算器」後，div會生成動畫，首先是高度，然後是寬度，並位於頁面上所有其他元素的頂部。這適用於IE9，Chrome，FireFox & Safari，不幸的是它拒絕在IE7/IE8中工作。jQuery。動畫寬度在IE7/IE8中不起作用

單擊「報價計算器」時，它只會動畫高度，然後停止 - 在頁面上留下一條粗藍線，但不會爲寬度設置動畫。

我在這裏搜索了一個類似的問題，並在谷歌，無濟於事..什麼問題？

這裏是我的代碼：

$("#calcbutton").click(function() { 
    $("#pnecontainer").show(); 
    $("#pnecontainer").animate({height: "550px", position: "absolute", top: "75px"}); 
    $("#pnecontainer").animate({width: "925px", left: "-635px"}); 
});

有沒有辦法讓它在IE7/IE8的工作，否則我將不得不滿足於東西少aestetically賞心悅目，就像消失/重新出現盒？

UPDATE：

我已經實現了動畫都在同一行/爲同一功能的一部分。

有趣的是，由於某種原因，雖然它不會讓我實現首先點擊相同功能的2個動畫，它允許我這樣做對減少功能，像這樣：

$("#minimizebutton").click(function() { 
    $("#pnecontainer").animate({width: "-925px"}); 
    $("#pnecontainer").animate({height: "-550px", top: "-635px"}); 
    $("#pnecontainer").hide(100); 
});

奇怪..想法任何人？（評論僅供請，答案已被接受）

來源

2012-11-15 Dom

你想使用回調函數，等待動畫的寬度，直到其他動畫完成，或者只是把所有的動畫在同一.animate()

對於JS而言，IE7/8並不是很好，更不用說動畫了，所以同時運行的同一個項目上的兩個動畫可能是導致這個問題的原因。

$("#pnecontainer").animate({height: "550px", position: "absolute", top: "75px"} 
    , function() { 
     $("#pnecontainer").animate({width: "925px", left: "-635px"}); 
});

或者動畫這一切在1號線

$("#pnecontainer").animate({height: "550px", position: "absolute", top: "75px", 
          width: "925px", left: "-635px"});

來源

2012-11-15 16:26:12

謝謝，動畫所有在一行中的作品，它仍然看起來好似70％，所以我對這個修補程序感到滿意，另外兩個誰回答了'位置'屬性是正確的，如果我全部實現動畫一行*與'位置'，沒有任何反應。所以，爲所有人提供支持並接受這個答案。 :) – Dom

IE7中的jQuery .animate()不承認財產'position'。

試試這個：

CSS

#pnecontainer { position: absolute; }

$("#calcbutton").click(function() { 
    $("#pnecontainer").show(); 
    $("#pnecontainer").animate({height: "550px", top: "75px"}); 
    $("#pnecontainer").animate({width: "925px", left: "-635px"}); 
});

來源

2012-11-15 16:27:57

IE7瀏覽器不認識內部的財產 '位置'，你不能運行2個動畫在同一時間

來源

2012-11-15 16:35:07

jQuery。動畫寬度在IE7/IE8中不起作用

回答

相關問題