|
| Joined: Dec 2002 Posts: 3,255 Likes: 3 UGN Elite | UGN Elite Joined: Dec 2002 Posts: 3,255 Likes: 3 | Okay, per Gizmo's advice I went in search of a javascript that forces IE to properly handle png graphics. As usual I found our sexy admin to be correct. There is a javascript that forces IE to handle the alpha layers of a PNG graphic correctly. Wow!!! This is really cool as up till now it was gif or nothing to hit the main stream. Below is the code. Can anyone explain it to me? // Correctly handle PNG transparency in Win IE 5.5 or higher.
// http://homepage.ntlworld.com/bobosola. Updated 02-March-2004
function correctPNG()
{
for(var i=0; i<document.images.length; i++)
{
var img = document.images[i]
var imgName = img.src.toUpperCase()
if (imgName.substring(imgName.length-3, imgName.length) == "PNG")
{
var imgID = (img.id) ? "id='" + img.id + "' " : ""
var imgClass = (img.className) ? "class='" + img.className + "' " : ""
var imgTitle = (img.title) ? "title='" + img.title + "' " : "title='" + img.alt + "' "
var imgStyle = "display:inline-block;" + img.style.cssText
if (img.align == "left") imgStyle = "float:left;" + imgStyle
if (img.align == "right") imgStyle = "float:right;" + imgStyle
if (img.parentElement.href) imgStyle = "cursor:hand;" + imgStyle
var strNewHTML = "<span " + imgID + imgClass + imgTitle
+ " style=\"" + "width:" + img.width + "px; height:" + img.height + "px;" + imgStyle + ";"
+ "filter:progid:DXImageTransform.Microsoft.AlphaImageLoader"
+ "(src=\'" + img.src + "\', sizingMethod='scale');\"></span>"
img.outerHTML = strNewHTML
i = i-1
}
}
}
window.attachEvent("onload", correctPNG);
| | |
▼ Sponsored Links ▼
▲ Sponsored Links ▲
| | | Joined: Feb 2002 Posts: 7,203 Likes: 11 Community Owner | Community Owner Joined: Feb 2002 Posts: 7,203 Likes: 11 | I may have known it exists but i'm not sure how to explain it, our good friend Ian Spence would be able to give you a hand me thinks... He's been toying with stuff like this forever... | | | | Joined: Aug 2003 Posts: 11 Junior Member | Junior Member Joined: Aug 2003 Posts: 11 | // Correctly handle PNG transparency in Win IE 5.5 or higher.
// http://homepage.ntlworld.com/bobosola. Updated 02-March-2004
function correctPNG()
{
// Loop through all the images in a page
for(var i=0; i<document.images.length; i++)
{
// img = the number i image of the page
var img = document.images[i]
// imgname = uppercase version of url
var imgName = img.src.toUpperCase()
// If url ends in PNG
if (imgName.substring(imgName.length-3, imgName.length) == "PNG")
{
// If the image has an id, add it to the html we're creating
var imgID = (img.id) ? "id='" + img.id + "' " : ""
// Same thing for class name
var imgClass = (img.className) ? "class='" + img.className + "' " : ""
// As well as title attribute
var imgTitle = (img.title) ? "title='" + img.title + "' " : "title='" + img.alt + "' "
// Make the img display correctly, transfer style attribute
var imgStyle = "display:inline-block;" + img.style.cssText
// If the image was aligned, float the div
if (img.align == "left") imgStyle = "float:left;" + imgStyle
if (img.align == "right") imgStyle = "float:right;" + imgStyle
// If the image was inside a link, add the pointing cusor
if (img.parentElement.href) imgStyle = "cursor:hand;" + imgStyle
// Put together all the html with what we created
var strNewHTML = "<span " + imgID + imgClass + imgTitle
+ " style=\"" + "width:" + img.width + "px; height:" + img.height + "px;" + imgStyle + ";"
+ "filter:progid:DXImageTransform.Microsoft.AlphaImageLoader"
+ "(src=\'" + img.src + "\', sizingMethod='scale');\"></span>"
// Add the html to the document
img.outerHTML = strNewHTML
// Honestly, this confuses me
i = i-1
}
}
}
// Run this function as soon as the page loads
window.attachEvent("onload", correctPNG);
| | | | Joined: Feb 2002 Posts: 7,203 Likes: 11 Community Owner | Community Owner Joined: Feb 2002 Posts: 7,203 Likes: 11 | See, told you he'd know  | | | | Joined: Dec 2002 Posts: 3,255 Likes: 3 UGN Elite | UGN Elite Joined: Dec 2002 Posts: 3,255 Likes: 3 | Ian thanks for the break down. | | |
Forums41 Topics33,840 Posts68,858 Members2,176 | Most Online3,253 Jan 13th, 2020 | | | |
|