Preview Post

NickE · July 2006

Preview Post

Diffusio · April 2007

works like a charm on my board. thanks a bunch.

Wanderer · April 2007

Yes my only problem with it is the preview.png looking ugly in Exploder so I changed it to a .gif and it looks much better.

Posted: Thursday, 5 April 2007 at 7:34AM

Rysk · April 2007

Cause alls the PNG Files (such as the Smileys from the Smiley ext.) such ugly borders? I also recognized it, but instructed my users, to use firefox :P

so simply converting all PNG to GIFs? (and changing the according links)

Wanderer · April 2007

GIFs need to be made with the background color they will sit on in mind, so if it's white all the time or pale blue all the time that's fine.

If you make a GIF with a white mask and place it over a pale blue background it will have a white halo around it - ugly.

If there are many background colors to take into account, PNGs are better because they have true transparency, except for Exploder of course.

Posted: Thursday, 5 April 2007 at 7:42AM

Rysk · April 2007

meens, I have to make them, when I have definitely found my style and know, which transperancy color I need, or neglect the pooor IEx users

Wanderer · April 2007

If you want to persist with PNGs, try putting the code below into a text file called pngfix.js and place it on your server.

Then put this into the head section of each page...
<script type="text/javascript" src="http://www.yourdomain/forum/pngfix.js"></script>

// Correctly handle PNG transparency in Win IE 5.5 or higher.
// http://www.infolink.net.au

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);

It works well but may take a few seconds on each page depending on how many PNGs it has to fix and how big they are.

Posted: Thursday, 5 April 2007 at 7:58AM

Rysk · April 2007

ok ok, I'll try it... I'll post, wheter it works...

Thanks so long

alast · April 2007

now you can do this through Nuggets, I guess.

Wanderer · April 2007

Yes, Nugget would be ideal for this, add it to a "head tag" pan and cook it!

Posted: Thursday, 5 April 2007 at 6:54PM

MySchizoBuddy · April 2007

don't escape single quotes. Nuggets will do it by itself
try this. provided this code actually works.??


<script type="text/javascript">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
}
}
}
if (window.attachEvent)
window.attachEvent("onload", correctPNG);
else
window.onload=correctPNG;

</script>

alast · April 2007

well, this doesn't work for me. This way the script-nugget kills off an image one also located in the Head tag. Whereas that wasn't the case with Wanderer's option.

MySchizoBuddy · April 2007

whats ur website
and where is the png image

Wanderer · April 2007

I didn't mean put the entire JavaScript in the Head Nugget, simply the link to it....

<script type="text/javascript" src="/wherever.it.lives/pngfix.js"></script>

Posted: Thursday, 5 April 2007 at 10:15PM

alast · April 2007

@Wanderer - I know that

@MySchizoBuddy - the png image is also in the Head tag (1) with the script there as (0) (now it is with the Wanderer's option):

here

PS: Ooops.. just found out that it doesn't work in Opera (mac)

alast · April 2007

yes, I haven't tested it with some other browsers, but Wanderer's script (no matter how activated) does kill pngs in (mac) Opera

MySchizoBuddy · April 2007

u shouldn't need png fix for opera. so just wrap the script around


alast · April 2007

thanks

Dogen · April 2007

works great, thanks!

Lussumo Bot · May 2007

Uploaded version 2.5 of Preview Post.

jross · July 2007

hmm, recently moved to a new server - along with spellchecker - preview post is not working - I tried version 2.5 - then i reverted to version 2.1. No luck, the message I'm getting is: Line: 55 Char: 4 Error: Unknown runtime error Code: 0

Preview Post

Comments