print.css - using alternative img instead of swf

[oneblack]

Hello!

Whilst using a print.css Is there a way to use an alternative image the instead of printing a frame of the .swf (the flash content gracefully degrades to a image when flash is not installed btw).

cheers

paul

[benihana]

you could try wrapping the flash in a div, and apply a background image to that div. Then in your print.css use:

object {
visibility:hidden;
}

welcome to WebmasterWorld!

[bedlam]

you could try wrapping the flash in a div, and apply a background image to that div.

Not likely to be very helpful since most browsers do not print background images unless the user has changed the default settings.

Something like this might be better:

HTML:

<div id="flashContainer">
<img src="..." alt="..." />
<object>
...
...
</object>
</div>

CSS:

div#flashContainer {
width:100px; /* Give it a width */
height:100px; /* Give it a height */
position:relative; /* Relatively position it; this won't change its position... */
}

div#flashContainer object,
div#flashContainer img {
width:100px; /* Give them a width */
height:100px; /* Give them a height */
position:absolute; /* Position them absolutely... */
top:0; /* 0px from top of container... */
left:0; /* 0px from left of container */
}

div#flashContainer object {
z-index:100; /* Give it a large z-index to make sure it appears on top */
}

div#flashContainer img {
z-index:1; /* Give it a low z-index to make sure it doesn't appear on top */
}

In combination with Benihana's suggestion to set 'visibility:hidden;' on the object element in your print stylesheet, this should do what you need: the browser won't show the flash, but it will show the img behind the flash. If you need to do this on a wide range of browsers, you'll need to do a bit more research [google.com] on how to get it to work reliably in some of the shakier browsers...

-B

[benihana]

since most browsers do not print background images

:) hehe I should have thought it through......

[oneblack]

thanks bedlam!