jQuery fadeIn IE Png從外部加載時發出的問題

我使用jQuery中的加載內容方法將數據從我域中的外部html文件加載到我的網頁上的div中。我將div從新頁面中移出，同時將div隱藏在當前頁面中，淡出並淡入新頁面。在這兩個div中都有一個png圖像，它在IE中創建可怕的黑色斑點，工作正常在其他瀏覽器中，但由於IE無法處理多個過濾器而導致混亂。jQuery fadeIn IE Png從外部加載時發出的問題

我試過使用單位PNG修復無效，有沒有人有任何修復或想法，以幫助保持我的PNG在這個過渡期間看起來不錯？

i46.tinypic.com/t9dtvr.jpg這是問題的一個屏幕截圖，歡呼聲

還發現，這是在頁面的淵源（裝載任何新的東西前）PNG淡入和出完美的使用單位PNG修復但東西加載，然後從外部文件退出不。我也修復了這些頁面，但也不起作用。

來源

2009-11-27 Adam Stone

您是否在談論PNG邊緣的抗鋸齒？ –

http://i46.tinypic.com/t9dtvr.jpg這是問題的屏幕截圖，歡呼 –

也發現原始頁面上的png（在加載任何新內容之前）會完美地使用單位png淡入淡出修復，但東西加載，然後從外部文件退出doesnt。我也修復了這些頁面，但也不起作用。 –

這個問題沒有任何100％的解決方案。如果您的PNG具有半透明區域，則應用的所有濾鏡都會使這些區域完全不透明。我見過的大多數淡入淡出過渡都會在淡入淡出時應用濾鏡，然後再移除濾鏡。這意味着當圖像淡入時您會看到別名區域，但在過渡結束時看起來會很好。

另一種解決方案可用於靜態頁面的部分：如果圖像背後的背景是靜態的，您可以從該背景創建圖像並將其用作img標記的背景圖像。然後，淡入淡出將工作得很好。如果png圖像已經是一個元素的背景圖像，則需要將其放入一個容器中，然後設置不透明背景圖像並淡入淡出。

如果您在文字或動態內容前淡出，則可以做的事情不多。

編輯：以下頁面似乎有涉及舊AlphaImageLoader的過濾器，並與不透明度濾光器中設置的父DIV的解決方案：

http://blog.mediaandme.be/?ref=17

來源

2009-11-27 11:02:03

你可以給PNG圖像（或褪色的元素）一個background-color值以外的透明？這主要是hels。

來源

2009-11-27 10:56:46

背景顏色不能被設置爲網站的背景需要通過它看到。 –

顯式背景顏色的相同問題：透明？ –

編輯：我來張貼這是無望的，但實際上有些人在描述變通方法。看看這有助於：

http://groups.google.com/group/jquery-dev/browse_thread/thread/1f693c5f4e8ea650/f3bc9685ccb40e70?pli=1 http://blogs.msdn.com/ie/archive/2005/04/26/412263.aspx

來源

2009-11-27 11:54:49 Greg

-1

所有你需要做的就是讓周圍的元素包裝（樣式）（#outer（有背景PNG））淡入js文件不透明度爲1.0。很棒！

例如：

js文件：

$('#style').fadeIn('slow');

css文件：

#style 
{ 
    margin:0; 
    background:transparent; 
    float:left; 
}

來源

2010-03-20 15:35:13 Amy

我有一個類似的問題。我需要根據用戶輸入將幾個透明PNG中的一個加載到我的頁面中，並將其淡入。我最終使用了Drew Diller的Belated PNG修復（適用於IE6）。在文件準備過程中的動態內容不工作調用，所以這裏是我的腳本是什麼樣子：

html = '<img src="selectedimage.png" />'; 
$('#overlay').html(html); 
DD_belatedPNG.fix('#overlay img'); 
$('#overlay img').hide().fadeIn(1200);

它在IE7中工作的偉大，但我沒有測試IE8呢。

來源

2010-08-29 20:30:21 bgannon

@jdln - 我不知道這是什麼，她要去的，並解釋是錯誤的，或者這是另一種解決方案，但這個工作對我來說：

應用透明PNG到一個包裝元素
將你的淡入淡出應用到包裝的內部元素。這似乎也迫使包裝器元素顯示。
隱藏的包裝元素，顯示了使用內容元素的jQuery褪色

例如：

/* HTML: */ 
<div id="wrapper"> 
    <div id="content">I use this for a drop-down menu with a transparent PNG shadow for lte IE8 browsers 
    </div> 
</div> 

/* CSS */ 
#wrapper{margin-left:-9999px;} 

/* jQuery */ 
$('#content').hide().fadeIn();

我用.hide（），以確保效果從一開始每次啓動時，因爲我從懸停事件中調用這個。希望這有助於！

來源

2011-02-23 18:36:52 Lauren

我有一個與透明PNG背景元素褪色類似的問題。經過一番研究，我發現這個頁面，在此，最終你會找到一個解決方案，幫助我：

http://www.sitepoint.com/forums/showthread.php?590295-jQuery-fadein-fadeout-of-transparent-png-in-IE7-and-Chrome

dan.tello使用額外的過濾器（CSS）在IE用戶：

.item img { 
    background: transparent; 
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#00FFFFFF,endColorstr=#00FFFFFF)"; /* IE8 */ 
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#00FFFFFF,endColorstr=#00FFFFFF); /* IE6 & 7 */  
    zoom: 1; }

來源

2012-10-09 12:05:14

jQuery fadeIn IE Png從外部加載時發出的問題

回答

相關問題