Fix Live Chat Window Floating Behind Flash Elements

Recently we had a client add live chat to their website. This not only caused a number of WC3 validation errors but we also noticed the floating widow launched by their software Bold Chat was disappearing behind the flash banners on Internet Explorer browsers such as IE8.

As luck would have it our flash guru was off for the week. After fixing the validation errors the html/css crew set out to resolve this “flash” issue using the z-axis. That didn’t work. Bold Chat support was had to come by and after scouring the internet our html team learned a little bit more about this strange sucupus they call “flash”.

This client’s site was using SWFObject Express Install to load the flash. By simply adding the following tag inside the object.

<param name="wmode" value="transparent"/>

Once added in the HTML the problem was slved. While this may seem so fundamental and not worth a post to many of you this information specific to live chat was non-existent on the web. We can say once we told this to our flash expert he chuckled and responded with a “duh” as he walked away chortling.

Here is the code (with the SWFObject replacement code removed for simplicity)

<object classid="clsid:xxx-xxxx-xxx-xxx" name="howto"
width="your with" height="your height" id="you id" title="your image title">
<param name="movie" value="/flash/animation-green.swf" />
<param name="wmode" value="transparent"/>
</object>
This entry was posted in Code, Flash, Web Design. Bookmark the permalink.

Leave a Reply

Your email address will not be published. Required fields are marked *

*

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>