Transparency

To make windows behind our desktop application 'show through' we can use the property transparency to give Sidewinder the value of a colour that will be set to 'transparent'. This has the effect of allowing any application that is behind our web application to be visible and respond to mouse-clicks--extremely useful if we want to give our application a different shape. The chrome is often removed when using transparency.

By adding the following settings to the Flickr Search web application our application would have none of the usual desktop application chrome, and the entire application would appear to grow and shrink as the user searched:

    <meta name="autohide" content="true" />
    <meta name="height" content="700" />
    <meta name="chrome" content="false" />
    <meta name="transparency" content="fffffe" />
    <style type="text/css">
      body
      {
        background-color : #fffffe;
      }
      html, body
      {
        margin           : 0;
      }
    </style>
    <xf:model>

The modified application is available here.

Alternatively, we can open the basic Flickr web application with the following command:

swviewer2 http://svn.x-port.net/svn/public/samples/flickr/flickr.webapp#meta(position=top-right,anchor,autohide,height=700,chrome=false,transparency=fffffe)

Note however that this won't quite work with the example we've been using, since a background of #fffffe needs to be added.