Skip to content
View in the app

A better way to browse. Learn more.

Tip.It Forum

A full-screen app on your home screen with push notifications, badges and more.

To install this app on iOS and iPadOS
  1. Tap the Share icon in Safari
  2. Scroll the menu and tap Add to Home Screen.
  3. Tap Add in the top-right corner.
To install this app on Android
  1. Tap the 3-dot menu (⋮) in the top-right corner of the browser.
  2. Tap Add to Home screen or Install app.
  3. Confirm by tapping Install.

Making transparent png's in internet explorer

Featured Replies

Ok so i was experimenting today and managed to get png's to work in internet explorer

 

 

 

 

 

 

 

Here is the proof of concept page. Sorry if i stole your sig to prove it :P

 

 

 

http://geocities.com/matt_sims101/pngtest.html

 

 

 

 

 

 

 

It uses a .js file to see if the browser is internet explorer and places png_fix.gif (a blank stransparent gif) in place of the alpha layer.

 

 

 

Png files are unaffected in opera and firefox but in ie the change is miraculous

 

 

 

 

 

 

 

Simply create a new file called png_fix.js in notepad and paste the following

 

 

 

if (navigator.platform == "Win32" && navigator.appName == "Microsoft Internet Explorer" && window.attachEvent) {



document.writeln('');



window.attachEvent("onload", fnLoadPngs);



}







function fnLoadPngs() {



var rslt = navigator.appVersion.match(/MSIE (\d+\.\d+)/, '');



var itsAllGood = (rslt != null && Number(rslt[1]) >= 5.5);







for (var i = document.images.length - 1, img = null; (img = document.images[i]); i--) {



if (itsAllGood && img.src.match(/\.png$/i) != null) {



var src = img.src;



img.style.width = img.width + "px";



img.style.height = img.height + "px";



img.style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='" + src + "', sizingMethod='scale')"



img.src = "png_fix.gif";



}



img.style.visibility = "visible";



}



}

 

 

 

 

 

 

 

Then at the top of every page use this line in the html

 

 

 

 

 

 

 

 

 

 

The blank gif is available here just right click save as.

 

 

 

 

 

 

 

One you have done this pngs will work perfect in all browsers and you can simply use them just like any other kind of image.

 

 

 

 

 

 

 

Maybe if we are lucky the admins will add this to this forum ;) Then all you IE users can see our pretty sigs

612d9da508.png

Mercifull.png

Mercifull <3 Suzi

"We don't want players to be able to buy their way to success in RuneScape. If we let players start doing this, it devalues RuneScape for others. We feel your status in real-life shouldn't affect your ability to be successful in RuneScape" Jagex 01/04/01 - 02/03/12

  • Author

Also it would be good if other people could test this on their own sites. I want to see if this works flawlessly :D

612d9da508.png

Mercifull.png

Mercifull <3 Suzi

"We don't want players to be able to buy their way to success in RuneScape. If we let players start doing this, it devalues RuneScape for others. We feel your status in real-life shouldn't affect your ability to be successful in RuneScape" Jagex 01/04/01 - 02/03/12

I'll test it on my webserver in a few.

Awesome job. I tested it on my webspace, and it works.

 

 

 

 

 

 

 

http://www.clearphp.com/demoris/pngfixtest.html

 

 

 

 

 

 

 

 

 

 

 

Wow. Thats great. I've never used png's much before because of Internet Explorer, but now I can. Sweet.

 

 

 

 

 

 

 

How exactly did you manage to figure this out?

demorisclaire2md7.jpg
  • Author

I used a similar js script to resize images and i was reading up on ways to make transparent png's in IE and found a really helpful site explaining a way of doing it. Just modified it a bit to work and bam :P

612d9da508.png

Mercifull.png

Mercifull <3 Suzi

"We don't want players to be able to buy their way to success in RuneScape. If we let players start doing this, it devalues RuneScape for others. We feel your status in real-life shouldn't affect your ability to be successful in RuneScape" Jagex 01/04/01 - 02/03/12

Guest
This topic is now closed to further replies.

Important Information

By using this site, you agree to our Terms of Use.

Account

Navigation

Search

Search

Configure browser push notifications

Chrome (Android)
  1. Tap the lock icon next to the address bar.
  2. Tap Permissions → Notifications.
  3. Adjust your preference.
Chrome (Desktop)
  1. Click the padlock icon in the address bar.
  2. Select Site settings.
  3. Find Notifications and adjust your preference.