Flash Tutorial:

How to show an alternative image on iPhone and iPad where Flash is not supported?

Flash animation improves website a lot, but unfortunately Flash is not supported on iPhone and iPad. This tutorial will guide you how to show an alternative image or alternative content on iPhone and iPad where Flash is not supported.

We are going to use two DIVs. The first DIV contains the alternative image, the second DIV includes the Flash animation. By default, the first DIV is hidden, and the second DIV is shown. We then use JavaScripts to detect the kind of web browser, if it's iPhone, iPod or iPad, we will show the first DIV and hide the second DIV.

The code is as following:

<div id="aleosoftimage" style="display:none">
<img src="flashmovie.gif">
</div>

<div id="aleosoftflash" style="display:block">

<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://fpdownload.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=8,0,0,0" width="540" height="140">
<param name="movie" value="flashmovie.swf" />
<param name="quality" value="high" />
<param name="allowScriptAccess" value="always" />
<param name="wmode" value="transparent" />
<embed src="flashmovie.swf"
quality="high"
type="application/x-shockwave-flash"
WMODE="transparent"
width="540"
height="140"
pluginspage="http://www.macromedia.com/go/getflashplayer"
allowScriptAccess="always" />
</object>

</div>

<script language="javascript">
if ((navigator.userAgent.match(/iPad/i) != null) || (navigator.userAgent.match(/iPhone/i) != null) || (navigator.userAgent.match(/iPod/i) != null)) { document.getElementById("aleosoftimage").style.display = "block"; document.getElementById("aleosoftflash").style.display = "none"; }
</script>

There are two DIVs in the code. The first DIV <div id="aleosoftimage" style="display:none"> contains the alternative image. By default, it's invisible. The second DIV <div id="aleosoftflash" style="display:block"> contains the Flash movie.

The JavaScript is to detect the kind of web browsr, if it's iPhone, iPod or iPad, it will show the first DIV aleosoftimage and hide the second DIV aleosoftflash.

Below is an example. Try to view it from computer and your iPhone or iPad.

Home | Download | Order Now | Contact us | Links | What's New | Company | Privacy policy | Site Map
Copyrightę Aleosoft.com All Rights Reserved.