08-08-2007, 12:27
|
|
|
|
חבר מתאריך: 09.04.02
הודעות: 8,000
|
|
פתרון לבעיית תמונות הרקע מסוג PNG ב-IE6
הפתרון ידוע כשמדובר בתגי img פשוטים, אבל זה לא כך כך טריוויאלי כשקובעים את התמונות כרקע ב-CSS. לא היה לי כוח להתחיל להמיר את כל תמונות הרקע שלי ל-GIF, אז כתבתי סקריפט קצר שמסדר את זה:
קוד:
window.onload = function()
{
var elementIdentifiers = ['bookmark-link', 'nav-next', 'nav-prev'];
for (var i in elementIdentifiers)
{
var currentElement = document.getElementById(elementIdentifiers[i]);
if (!currentElement) continue;
var backgroundImage = currentElement.currentStyle['backgroundImage'];
var backgroundImageUrl = backgroundImage.substring(5, backgroundImage.length-2);
var filterString = "progid:DXImageTransform.Microsoft.AlphaImageLoader (src='"+backgroundImageUrl+"', sizingMethod='scale')";
currentElement.style.backgroundImage = 'none';
currentElement.style.filter = filterString;
}
}
כדי שהקוד יוחל רק על דפדפני IE שלא תומכים בתמונות PNG שקופות, שימו את הקוד הבא ב-head:
קוד:
<!--[if lt IE 7.]>
<script defer type="text/javascript" src="iepngfix.js"></script>
<![endif]-->
תהנו
|