Firefox中的$ .css（）問題

我有這種情況，我想調用某個依賴於點擊值的元素。當鏈接包含圖像我想要顯示圖像，否則我想加載一個HTML頁面。當HTML頁面被加載時，我已經設計了這個欄來關閉不同的東西，就好像圖像被加載一樣。說我有這個CSS（這是一個HTML頁面加載時的樣式）

#shadow,#shadowRoute { position:fixed;left:0;top:0;width:100%;height:100%;z-index:500;background:black;opacity:0.8; } 
#shadowContent,#shadowContentRoute { position:fixed;z-index:550;background:white;padding:25px; } 
#closebar,#closebarRoute { text-align:right;background:#ebdfd3;width:740px;padding:5px;height:25px;text-transform:uppercase; } 
#content,#contentRoute { margin-top:25px;width:750px;height:450px;overflow:auto; } 
#imageSelectPrevious { position:absolute;left:0;top:45px;width:80px;z-index:600; } 
#imageSelectNext { position:absolute;right:0;top:45px;width:80px;z-index:600; } 
.imageNavLink { display:block;text-indent:-9999px; }

我使用下面的代碼來顯示加載圖像。這工作得很好，除了在樣式表中定義的背景顏色樣式的closebar。

$("#shadow").add($("#shadowContent")).fadeIn(500);  
$("#shadowContent").animate({width:'250px',height:'250px'},500).css({top:'25px',left:'50%',margin:'0 0 0 -125px',padding:'10px !important'}).empty().append('&lt;div id="closebar">&lt;a href="#close" id="closeBox">'+closeText+'&lt;/a>&lt;/div>').append('&lt;div id="content">&lt;/div>'); 
$("#closebar").animate({width:'250px'},500).css({background:'white !important',padding:'5px 0 !important'}); 
$("#closebar a").css({color:'#323232','font-weight':'bold',background:'url(http://www.cherrytrees.nl/tmp/Core/Images/closeIcon.jpg) left center no-repeat',padding:'0 0 0 20px'}); 
$("#content").animate({width:'230px',height:'230px'},500).css({margin:'0',padding:'90px'}).html("&lt;div id='imageSelectPrevious'>&lt;a href='#' id='prevImageLink' class='imageNavLink' title='' rel='prev'>Previous&lt;/a>&lt;/div>&lt;div id='imageSelectNext'>&lt;a href='#' id='nextImageLink' class='imageNavLink' title='' rel='next'>Next&lt;/a>&lt;/div>&lt;img id='popImageContainer' src='http://www.cherrytrees.nl/tmp/Core/Images/load.gif' style='margin:0'>&lt;/div>"); 
$("#prevImageLink").add($("#nextImageLink")).hide();

好吧，我現在有一些代碼，檢查圖像，獲取尺寸和一切。當圖像被完全加載我運行下面的代碼來改變容器的尺寸和顯示圖像

$("#shadowContent").animate({width:newWidth+'px',height:newHeight+'px'},500).css({top:'25px',left:'50%',margin:'0 0 0 -'+(newWidth/2)+'px !important'}); 
$("#content").animate({width:newWidth+'px',height:newHeight+'px'},500).css({margin:'0',padding:'0 !important'}); 
$("#closebar").animate({width:newWidth+'px'},500); 
$("#popImageContainer").css({padding:'0 !important'});

現在能正常工作在Chrome和Safari（IE未測試），但Firefox樣式與#ebdfd3背景closebar ，以某種方式爲圖像添加填充，並調整容器元素的位置。

是的，樣式表包含上述我的文檔中的JavaScript

我真的沒有一個線索做什麼，考慮到它在Chrome和Safari的事實..沒有任何人也許聽說過關於這樣的問題？

問題解決！ !important引起了問題！它現在工作正常！謝謝！

來源

2010-10-02 Maurice

單獨使用代碼非常困難，特別是因爲您沒有提供詳細的錯誤信息。你可能需要顯示一個實時鏈接 – 2010-10-02 14:25:21

另外，有什麼讓我覺得有問題的是'0！important'是非常重要的嗎？ – 2010-10-02 14:26:54

是的，我不認爲你可以在腳本中包含'！important'標誌......至少我從來沒有爲我工作過。 – Mottie 2010-10-02 14:30:43

請勿使用!important：在這種情況下它不起作用。

來源

2010-10-02 16:54:39

Firefox中的$ .css（）問題

回答

相關問題