vb.org Archive - Transparency PNG pictures with Internet Explorer 6 (server-side solution)

Page 1 of 2

Show 40 post(s) from this thread on one page

vb.org Archive (https://vborg.vbsupport.ru/index.php)

- vBulletin 3.5 Add-ons (https://vborg.vbsupport.ru/forumdisplay.php?f=113)

- - Transparency PNG pictures with Internet Explorer 6 (server-side solution) (https://vborg.vbsupport.ru/showthread.php?t=93415)

cclaerhout

08-01-2005 10:00 PM

Transparency PNG pictures with Internet Explorer 6 (server-side solution)

Purpose
Kill the grey backdrop of transparency PNG images in Internet Explorer 6 (server-side solution)
Thanks to Natch (https://vborg.vbsupport.ru/showthread.php?t=67413) and d00d (http://koivi.com/ie-png-transparency/)

Version of Koivi's script
2.0.12

Update
10/01/2006 : detect MSIE to ignore IE7 or greater

Installation
1)Edit the xml file, update line 8 with your information :

Code:

$img_path='http://www.websitedirectory.com/forumdirectory/images/'

AND save.

2)Import xml file with Plugin Manager.

3)Copy "spacer.png" picture to vbulletin images directory.

Information
-Sometimes (it depends) you will have to specify the height and the width of the png picture, otherwise, it won't work. Don't hesitate to go to d00d website he often update his code.
- When a link is above a png background, it will not work !
Works now ! thanks to Holger R?prich of "www.indesigns.de".
Go and see the solution here.
-With this extension, png pictures with vB collapse system don't work (under IE of course). P.S : even after having edited vbulletin_global.js

theArchitect

08-02-2005 03:56 AM

Fantastic. This is will come in most handy.

sirbutts

08-02-2005 04:16 AM

Quote:

Originally Posted by theArchitect

Fantastic. This is will come in most handy.

Beware this poses a heavy load on your server...

theArchitect

08-02-2005 04:34 AM

Quote:

Originally Posted by sirbutts

Beware this poses a heavy load on your server...

That is not so good. Though the sites I have in mind for this use very little traffic. So it should be ok.

But I will bear your warning in mind for the larger traffic sites.

Natch

08-02-2005 07:33 AM

Quote:

Originally Posted by sirbutts

Beware this poses a heavy load on your server...

I don't see the load issue you are talking about: it's not doing any image manipulation, just text replacement using a low-intensity str_replace()...

If this is a problem, then you should also turn off BBCODE processing, as that is far more intensive than this.

Note: this code does not and never has (or will) process PNG files linked in external CSS files, only in inline CSS (either within <style type="text/css"> tags or <div style="this-style: type;">)...

HTH, and GJ cclaerhout

Boofo

08-02-2005 08:14 AM

Hello stranger! ;)

cclaerhout

08-02-2005 08:18 AM

Quote:

Originally Posted by Natch

Happy to see you again Natch :)

cclaerhout

08-02-2005 06:55 PM

Little precision from Justin Koivisto himself :

Quote:

It's another bug with MSIE where for some reason when you use the
alpha filter, it places the image on top of everything, even though it
all appears correctly.

It means if a link is above a png background, it will not work !

cclaerhout

08-03-2005 11:29 AM

Information :
With this extension, png pictures with vB collapse system don't work (under IE of course).
P.S : even after having edited vbulletin_global.js

Johannes de Le?n

08-11-2005 09:21 AM

I use pngfix, it is much easier, and works great.

You can get it here.

Then just put this in the headinclude template:

Code:

<!--[if gte IE 5.5000]>

<script type="text/javascript" src="path/to/pngfix.js"></script>

<![endif]-->

cclaerhout

08-11-2005 10:46 AM

Quote:

Originally Posted by Johannes de Le?n

I use pngfix, it is much easier, and works great.

You can get it here.

Then just put this in the headinclude template:

Code:

<!--[if gte IE 5.5000]>

<script type="text/javascript" src="path/to/pngfix.js"></script>

<![endif]-->

I don't like this method eventhough i've suggested it here :
https://vborg.vbsupport.ru/showthread.php?t=77465

Why ?
1)It's not a sever side solution but a client side solution and i find it a lot slower on old compruters.
2)It's javascript.
3)It doesn't work with background pictures.

Bad Bunny

08-16-2005 07:45 PM

Quote:

Originally Posted by theArchitect

Fantastic. This is will come in most handy.

I installed this, and it works great. Thanks!

GrendelKhan{TSU

08-17-2005 02:15 PM

er...sorry for the stupid question...but I installed it...

but how do you know if its working?

:ermm:

Bad Bunny

08-17-2005 03:51 PM

Quote:

Originally Posted by GrendelKhan{TSU

er...sorry for the stupid question...but I installed it...

but how do you know if its working?

:ermm:

Use Internet Explorer for windows. Use PNGs that have gradient transparency. If there is a grey box around it, something is wrong.

cclaerhout

08-17-2005 05:53 PM

Quote:

Originally Posted by GrendelKhan{TSU

er...sorry for the stupid question...but I installed it...

but how do you know if its working?

:ermm:

You just have to use a png picture inside the code of vBulletin.
Try this hack : https://vborg.vbsupport.ru/showthrea...ewpost&t=94430 :-)

I'm working on a png bbcode to use png (with transparency) in threads. Width and height will have to be specified.

cclaerhout

08-26-2005 09:28 AM

Xml file updated with version of Koivi's script 2.0.11.

Quote:

Originally Posted by Koivi

UPDATE: (8/4/2005): There was a missing comma in the filter that caused MSIE 5.5 (6 was ok) to not render some background images. Thanks to Pierre Lemieux for reporting this!

Good news : there is may be a solution to make work a link above a png background.

cclaerhout

08-26-2005 12:02 PM

Quote:

Originally Posted by cclaerhout

there is may be a solution to make work a link above a png background.

Tested and approved :

Go to "All style options", then in "Additional CSS Definitions"
add :

Code:

*a {position:relative;}

And that works !
Thanks to Holger R?prich of www.indesigns.de

cclaerhout

09-17-2005 02:26 PM

Quote:

Originally Posted by cclaerhout

Tested and approved :

Go to "All style options", then in "Additional CSS Definitions"
add :

Code:

*a {position:relative;}

And that works !
Thanks to Holger R?prich of www.indesigns.de

Warning : don't use

Code:

*a {position:relative;}

with vbshout or it will cause a bug !

Instead, just add a style to your link

Code:

style="position:relative;"

Avalon111

10-13-2005 08:23 AM

works like a charm!
thanks!!!

TygerTyger

10-19-2005 09:40 AM

This hack is only necessary for 24-bit PNG images by the way. 8-bit PNG images (single colour transparency) work fine in IE without a hack.

weaver

10-19-2005 10:31 AM

Quote:

Originally Posted by cclaerhout

Warning : don't use

Code:

*a {position:relative;}

with vbshout or it will cause a bug !

Instead, just add a style to your link

Code:

style="position:relative;"

Thanks! I had the vbshout bug you mentioned.

leokoudo

11-03-2005 03:07 PM

where do I hook this plugin?

voidet

12-18-2005 09:42 AM

Hey hey,

I am having problems with using this hack.
I am running 3.5.2 and when installed non of my PNG images show up at all.

I have uploaded spacer, installed the plugin, added the link mod, and changed the width and height of my image, but still the image doesnt show up :(

What am i doing wrong :'(

board.trash

12-18-2005 06:39 PM

Quote:

Originally Posted by voidet

same problem here :disappointed:

350Chevy

12-30-2005 03:57 PM

Quote:

Originally Posted by cclaerhout

Warning : don't use

Code:

*a {position:relative;}

with vbshout or it will cause a bug !

Instead, just add a style to your link

Code:

style="position:relative;"

What do you mean by "add a style to your link"?

evenmonkeys

01-07-2006 10:37 PM

NEVERMIND

MillerLight

01-10-2006 04:53 AM

Can someone explain how to import this correctly?

cclaerhout

01-10-2006 09:18 AM

To 350Chevy :
A simple example :

Code:

<td class="tcat" width="100%" style="background-image: url('styles/lesatirique/cats/menumilieu.png');height:46px;"><a href="forumdisplay.php?$session[sessionurl]f=$forum[forumid]" style="position:relative;">$forum[title]</a></td>

You have a background image on a cell of a table. And into that cell you have text linked to an URL. The hack is going to put the picture above the link. To avoid this, just apply a CSS to the link : style="position:relative;"

To voidet and board.trash :
It should work. Check if the path to spacer.png file is correct.

In most of cases, you don't have to specify width and height BUT you have to use relative links. I explain :
Go to the Style Manager, choose your style and click on "GO" (All style options). Your Image Paths must also be written with relative URLs :
"/forum/directory1/directory12/butons"
AND not :
"http://www.somethingforvb.com/forum/directory1/directory12/butons"

Do the same thing into your templates. It should work.

Now if some images don't display don't use for them relative links and don't forget to specify height and width.
Exemple :

Code:

<img src="http://www.somethingforvb.com/forum/directory1/directory12/picture.png" height="46" width="22" alt=""/>

To leokoudo :
... go to your Plugin Manager and "Add New Plugin". That's all. Of course, don't forget to edit your xml file.

cclaerhout

01-10-2006 09:20 AM

Script update

BaselineAce

01-16-2006 06:03 PM

I am currently using the JS hack, which many users find too slow.

I have yet to get a straight answer as to the effect this has on the server load. I'd imagine that it's not pretty...

tm3500

01-27-2006 11:17 PM

When I install this the images disappear completely:

http://www.sierraleone.com/pngprob.jpg

Any idea what I'm doing wrong?

cclaerhout

02-07-2006 02:17 PM

Quote:

Originally Posted by tm3500

When I install this the images disappear completely:

http://www.sierraleone.com/pngprob.jpg

Any idea what I'm doing wrong?

You have to precise the size (width and height) of the reply button. That's all.

Lucas

02-11-2006 01:47 PM

So this does not affect server load, correct? I have kind of a busy forum and don't want to lag the complete machine.

Regards.

HollyRidge

02-17-2006 04:26 PM

Extremely slow for pages especially when it is needed several times such as with "Png Rounded Quotes (PRQ) version 3.00 - Valid XHTML 1.0" at https://vborg.vbsupport.ru/showthread.php?t=94430 If the plugin is disabled in the plugin manager pages load normally fast. When this plugin is enabled it takes forever for pages to load.

Also to note, tried the js hack and it did not work at all. This hack did work however is extremely resource needy.

If it helps server running on is dual xeon 2.4 ghz, 1 gb ram, etc, etc. with hardly any previous load on it. The forums were also turned off with no current visitors. The reason I am adding this info is to help point out that there is a problem here with this hack.

sandalwood

03-28-2006 01:35 AM

Quote:

Originally Posted by TygerTyger

This hack is only necessary for 24-bit PNG images by the way. 8-bit PNG images (single colour transparency) work fine in IE without a hack.

UHM, wtf is everyone ignoreing this CRITICAL comment??

solution to all your problems right there, if true. just convert your png to 8bit!!

cclaerhout

04-06-2006 05:23 PM

Well in a 8 bit png picture, you will loose the alpha transparency and the result will be similar as a gif transparency picture. If the solution was such simple, developers wouldn't spend so much time to find a way to make transparency works well with IE. Any way IE7 fixes the problem.

I don't think this hack is intensive for the server, but it is for IE on YOUR computer.

GrendelKhan{TSU

04-17-2006 01:59 PM

how do I UNinstall this?

just delete the plugin?

cclaerhout

04-21-2006 07:49 AM

Yes, that's it.

sensimilla

06-08-2006 07:46 PM

Any chance to make it work with plugin accelerator hack ?

Avalon111

12-01-2006 08:31 AM

in vb 3.6.x this modification is causing display errors of png images.
which means that in many forums pngs are NOT displayed everytime.

All times are GMT. The time now is 04:46 PM.

Page 1 of 2

Show 40 post(s) from this thread on one page

X vBulletin 3.8.12 by vBS Debug Information
Page Generation 0.01481 seconds Memory Usage 1,837KB Queries Executed 10 (?)
More Information
Template Usage: (1)ad_footer_end (1)ad_footer_start (1)ad_header_end (1)ad_header_logo (1)ad_navbar_below (13)bbcode_code_printable (17)bbcode_quote_printable (1)footer (1)gobutton (1)header (1)headinclude (6)option (1)pagenav (1)pagenav_curpage (1)pagenav_pagelink (1)post_thanks_navbar_search (1)printthread (40)printthreadbit (1)spacer_close (1)spacer_open Phrase Groups Available: global postbit showthread	Included Files: ./printthread.php ./global.php ./includes/init.php ./includes/class_core.php ./includes/config.php ./includes/functions.php ./includes/class_hook.php ./includes/modsystem_functions.php ./includes/class_bbcode_alt.php ./includes/class_bbcode.php ./includes/functions_bigthree.php Hooks Called: init_startup init_startup_session_setup_start init_startup_session_setup_complete cache_permissions fetch_threadinfo_query fetch_threadinfo fetch_foruminfo style_fetch cache_templates global_start parse_templates global_setup_complete printthread_start pagenav_page pagenav_complete bbcode_fetch_tags bbcode_create bbcode_parse_start bbcode_parse_complete_precache bbcode_parse_complete printthread_post printthread_complete
Messages: