 |
 | Home | Contact Us | FAQ | Search & Site Map | Link to Us |
 | Sign In | Join | Other 45 Sites in Network |
.NET Forum / ASP.NET / General / March 2008Transparent png images in IE6
I use png images with transparent backgrounds for the following ASP.NET server controls: Image, ImageButton, ImageMap, Panel (BackImageUrl for Panel). The images display correctly in IE7, but not IE6. What is the preferred solution to make all of these display correctly in IE6? On Mar 25, 9:34 am, Greg Peters <GregPet...@discussions.microsoft.com> wrote: > I use png images with transparent backgrounds for the following ASP.NET > server controls: Image, ImageButton, ImageMap, Panel (BackImageUrl for > Panel). The images display correctly in IE7, but not IE6. What is the > preferred solution to make all of these display correctly in IE6? I use the following: <head><title></title> <!--[if IE]> <script type="text/javascript"> //lte IE 6 function correctPNG() // correctly handle PNG transparency in Win IE 5.5 & 6. { var arVersion = navigator.appVersion.split("MSIE") var version = parseFloat(arVersion[1]) if ((version >= 5.5) && (document.body.filters)) { 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); </script> <![endif]--> <style> table { -moz-opacity:0.5; filter:alpha(opacity=50); opacity: 0.5; } </style> </head> <body> ... <table > <tr> <td> <img src="<your png image"> </td> </tr> </table> </body> </html> hope this helps...see it at http://apps.facebook.com/fbtestappsiccolo/ ... more at http://www.siccolo.com/articles.asp Thank you for your response. I tried it out in my application. It does work for images. It does not work for ImageButtons, ImageMaps or Panels with transparent backgrounds. > On Mar 25, 9:34 am, Greg Peters <GregPet...@discussions.microsoft.com> > wrote: [quoted text clipped - 77 lines] > > ... more at http://www.siccolo.com/articles.asp Hello, I solved the ImageMap problem by using blank images over the hot spots. The panel backgrounds were just oval gradients, so I converted those to gifs, which look just as good as the pngs. Thanks again for your post. > Thank you for your response. I tried it out in my application. It does work > for images. It does not work for ImageButtons, ImageMaps or Panels with [quoted text clipped - 81 lines] > > > > ... more at http://www.siccolo.com/articles.asp
Free MagazinesGet these publications absolutely FREE for up to 12 months. There are no hidden fees and no obligation. Simply choose a title, complete the application form and submit it. Read more ...
|
Reply to this Message
|
 Sign In
 Join
 My Latest Posts My Monitored Threads My Blog My Photo Gallery My Profile My Homepage Start New Thread Enable EMail Alerts Rate this Thread
|
©2008 Advenet LLC Privacy Policy - Terms of Use
This website includes both content owned or controlled by Advenet as well as content owned or controlled by third parties.