No Flash Replace with Image

In the script below, the Javascript on the HTML page will check to see if the user has Flash. If the user has Flash, the animation contained on THE SAME page will be displayed. If the user does not have Flash player installed on her machine, or the user doesn’t even have Javascript, a graphical representation, alternative image of the Flash animation you provide will be displayed.

<script language="Javascript">
<!--
var MM_contentVersion = 6;
var plugin = (navigator.mimetypes && navigator.mimetypes["application/x-shockwave-flash"]) ? navigator.mimetypes["application/x-shockwave-flash"].enabledPlugin : 0;
if ( plugin ) {
var words = navigator.plugins["Shockwave Flash"].description.split(" ");
for (var i = 0; i < words.length; ++i)
{
if (isNaN(parseInt(words[i])))
continue;
var MM_PluginVersion = words[i];
}
var MM_FlashCanPlay = MM_PluginVersion >= MM_contentVersion;
}
else if (navigator.userAgent && navigator.userAgent.indexOf("MSIE")>=0
&& (navigator.appVersion.indexOf("Win") != -1)) {
document.write('<scr' + 'ipt language="VBscript"\> \n'); //FS hide this from IE4.5 Mac by splitting the tag
document.write('on error resume next \n');
document.write('MM_FlashCanPlay = ( Isobject(Createobject("ShockwaveFlash.ShockwaveFlash." & MM_contentVersion)))\n');
document.write('</scr' + 'ipt\> \n');
}
if ( MM_FlashCanPlay ) {
document.write('<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"');
document.write(' codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,0,0" ');
document.write(' id="script" width="300" height="200" align="">');
document.write(' <param name="movie" value="banner.swf"> <param name="quality" value="high"> <param name="bgcolor" value="#FFFFFF"> ');
document.write(' <embed src="banner.swf" quality="high" bgcolor="#FFFFFF" ');
document.write(' swLiveConnect="false" width="300" height="200" name="script" align=""');
document.write(' type="application/x-shockwave-flash" pluginspace="http://www.macromedia.com/go/getflashplayer">');
document.write(' </embed>');
document.write(' </object>');
} else{
document.write('<img src="banner.gif" width="300" height="200" usemap="#script" border="0">');
}
//-->
</script><noscript><img src="banner.gif" width="300" height="200" usemap="#script" border="0"></noscript>

You will need to make some minor modifications to the above script for it to work properly for your site. Replace all instances of banner.swf with the relative path to your Flash movie location. Likewise, replace all instances of banner.gif with the page to the image that will be displayed if the user does not have Flash installed.

Be Sociable, Share!

About Shi Chuan

I am a web developer.
This entry was posted in JavaScript Advanced and tagged , . Bookmark the permalink.

5 Responses to No Flash Replace with Image

  1. oat2sen says:

    Brilliant article! Thanks for sharing this useful solution.

  2. Jo says:

    This didn’t work in Google Chrome, it shows both :(

  3. Doug says:

    Ya i tried this too and in Safari 4.0.4 it just shows the graphic now and no longer the flash banner like it did before. I have flash installed so there is no issue there. ??

  4. Ye Ko says:

    Thanks a lot! But how to replace jQuery if no flash.

  5. Hey there, You’ve done a fantastic job. I will definitely digg it and for my part suggest to my friends. I am sure they will be benefited from this web site.

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>