The Vodka God (allah_sulu) wrote in as_massive_tool,
The Vodka God
allah_sulu
as_massive_tool

Browser Question

One of the settings I'm playing with in the Massive Tool (which you'll most likely see in the next release) is image opacity. As you can (probably) see in figure one below, it is possible to set how opaque/transparent an image is, compared to its background. Internet Explorer and Firefox each employ a different command syntax for image opacity, so the Massive Tool adds both forms to the generated HTML code (see figure two). Those of you using browsers other than IE or Firefox, please let me know if you also see partially transparent animated images in the example below.

FIGURE ONE – Image Opacity

20%
40%
60%
80%
100%

FIGURE TWO – The Code

<img src="http://DammitJa.net/graphics/rh-ffbig.gif" style="opacity:0.5; filter:alpha(opacity=50);">

fnord Firefox code (scale of 0 to 1)
fnord Internet Explorer code (scale of 0 to 100)
 

EDIT: It occurs to me that, by using only the IE part of the code, you could deliberately make images invisible to IE users but visible to Firefox users (or vice versa). You know, if you felt like being evil... And if you put one image on top of the other, then the people seeing the top image as opaque would only see the top image, and the people seeing the top image as transparent would only see the bottom image. This is what I mean – If you're using IE right now, you should see the IE logo below. If you're using Firefox, you should see the Firefox logo below. If you have both browsers installed, then check it out. (If you're using any other browser, then you can tell me what you see.)

FIGURE THREE – Browser-Dependent Image Display

FIGURE FOUR – The Code

<table cellpadding=0 border=0 cellspacing=0 background=http://pics.livejournal.com/allah_sulu/pic/00061tkg><tr><td><img src="http://pics.livejournal.com/allah_sulu/pic/00062eyx" style="opacity:0"></td></tr></table>

fnord Firefox image URL
fnord Internet Explorer image URL

Note that both images should be the exact same size (in this case, both are 300x300) for this to work properly.
 

EDIT: According to respondents here and in in my journal, the Safari browser supports the Firefox version of the opacity commands. So does Netscape (which is Mozilla-based, like Firefox) and Opera.

Tags: browsers, html/css, inconsistencies, livejournal
Subscribe

  • Post a new comment

    Error

    Anonymous comments are disabled in this journal

    default userpic

    Your IP address will be recorded 

  • 14 comments