[dev] PNG alpha transparency with IE

[Daniel Eckl]

Hi List!

I love the possibility of those themes in horde, but they got me into a problem.
I need a logo in the upper left, and it needs transparency. But since the
background color can change through the themes, I need alpha transparency using
png.

But as many of you know, IE 5.5+ is only able to view this alpha with a rather
dirty css parameter.

So I made a patch to templates/horde/menu.inc to allow this. With this patch you
need to put a fully transparent gif named spacer.gif in the folder
/services/portal and it has to be the same size as the logo image you defined in
config/conf.php

It's in no way ready for committing, not only because of this stupid
spacer.gif. Well, see for yourself in the attachement.

There is another possibility where the spacer.gif only needs to be 1x1 px, but
then you have to give the spacer img tag the correct width and height in the
style parameter. As the logo image could be on another webserver in the worst
case, you cannot fetch this info easily. So we could make two new config
options where you define the height and width of the logo image. After these
parameters are known, you can make this tag:

<img src="spacer.gif" style="height: [height]px; width: [width]px filter:...."

We could locate the spacer.gif on a absolute location in the horde tree so we
could include this into Horde::img function, so any png image shown by horde
could have alpha on IE.

But there needs to be a "hordish style" solution and my programming abilities
are not good enough for this...

Perhaps if someone like to jump onto this train and code this with me or alone?

Greets,
Daniel
-------------- next part --------------
<table cellpadding="2" cellspacing="0" width="100%">
  <tr>
    <td class="menu" colspan="2">
      <table border="0" width="100%">
        <tr>
         <td width="100%">
           <?php
           if (!empty($conf['logo']['image'])) {
               if (!empty($conf['logo']['link'])) {
                   echo Horde::link($conf['logo']['link'], null, null, '_top');
               }
               if ( preg_match("/png$/i", $conf['logo']['image']) && preg_match('/msie\s(5|6)\.?[0-9]*.*(win)/i', $_SERVER['HTTP_USER_AGENT'] ) ) {
                 echo '<img src="spacer.gif" style="filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src=\''. $conf['logo']['image'] .'\', sizingMethod=\'scale\')" border="0" />';
               } else {
                 echo Horde::img($conf['logo']['image'], '', '', '');
               }
               if (!empty($conf['logo']['link'])) {
                   echo '</a>';
               }
           } else {
               echo '&nbsp;';
           }
           ?>
         </td>
        </tr>
      </table>
    </td>
  </tr>
  <tr>
    <td valign="top" class="sidebar-panel" width="100%">
      <?php echo $menutext ?>
    </td>
    <td>&nbsp;</td>
  </tr>
</table>