Show jpg instead of swf if flash disabled?

Hi, does anybody know of a good script to display a jpg or gif if plugins/flash is disabled.

I tried a simple if/else script with javascript but it just shows the jpg in ie for pc and not much in mac browsers!!!

Many Thanks

The one that comes with Flash MX and 2004 is very good.

To select it go to Publish Settings > HTML Tab > Template > Detect for Flash x

You’ll need to modify the JS script and <no script> tags to point to the right replacment image.

Hello

Here is some code to display the swf that I cannot take credit for.

I found it at A List Apart It is really for embedding swf files and maintaining standards, but it adds some code to display an image if the user does not have the flash plug-in installed. So That is why I am offering you this solution.

<object type="application/x-shockwave-flash"
 data="[color=Magenta]movie.swf[/color]?path=[color=Magenta]movie.swf[/color]" width="[color=Magenta]?[/color]" height="[color=Magenta]?[/color]">
 <param  name="movie" value="[color=Magenta]movie.swf[/color]?path=[color=Magenta]movie.swf[/color]" />
 <img src="[color=Magenta]noFlash.jpg[/color]" width="[color=Magenta]?[/color]" height="[color=Magenta]?[/color]" alt="NoFlash" />
 </object>

All you have to do is change the paths to reflect your directories and also set the width and height to what you need.

But wait there is some javascript to go with it:

function flashFix(){
   if(navigator.appVersion.indexOf("MSIE 5.5")!=-1){
 	for(i=0;a=document.getElementsByTagName("object")[i];i++){
 	  if(a.getAttribute("type") &&
 		 a.getAttribute("type").indexOf("application/x-shockwave-flash")!=-1 &&
 		 !a.getAttribute("classid")
 		 ){
 			a.outerHTML=a.outerHTML.slice(0,a.outerHTML.indexOf(">"))+
 			" classid='clsid:D27CDB6E-AE6D-11cf-96B8-444553540000' "+
 			"><param name='movie' value='"+
 			a.getAttribute("data")+
 			"' \\/>"+
 		    a.outerHTML.slice(a.outerHTML.indexOf(">")+1,a.outerHTML.length);
 		  }
 	}
   }
 }
 
 window.onload=function(){
   flashFix();
 };

Save that as: flashFix.js

Hope this works out for you.

Later
Johnny

Thats great, thank guys

Hello

I might add that you will need to link to the javascript file from any page you want to add the flash file on.

add this to the head section:

<script type="text/javascript" src="flashFix.js"></script>

Later
Johnny

Johnny - it dosent work in safari mac or opera mac, any ideas (and my ie on pc wont disable flash so i cant tell if it works there)

Hello

In all honesty I do not know anything about macintosh. Sorry for that.

The only problem I have encountered with that script is that in IE it does not seem to display a preloader it just waits til it is loaded.

Maybe someone with mac experience will see this thread and help you out.

If I learn of any solutions I will post here.

Later
Johnny

PS
If ytou want to check the image replacemet in IE just remove the flash file from the correct path temporarly and the image should appear.

Andyrossy, there’s an example of the JS code to do this (from Flash MX) here that should work on all platforms and modern browsers:

thats the one! thanks alot

chas (or anybody else) - i’ve altered a whole site that uses the above script to place a jpeg in place of flash, which is great, but one of the flash movies is buggering around, the url is:
http://www.dreamtimeevents.com/home.htm
but the movies work fine on all the other pages

I’ve tried re-publishing and checking all the flash settings (published to version 6) Any ideas how to sort this out pretty urgently?

Many Thanks

UPDATE: Ok i sorted the worst part out, it was down to the css file saying the div tag should be 124 pixels high when the movie is 140! but i still get the problem of the home page movie looking like it’s 5 pixels left and 5 pixels lower than all the others - any ideas???

Here’s a no JavaScript approach:

Try putting your Flash in a 1-cell table. In your CSS, create a style to set the background of the cell to your default image. In your HTML, add your Flash object tag.

If the user has Flash installed, you see your Flash media. If the user has an old version of Flash, you see the image until the new player is downloaded. If they have no Flash and plugins disabled, they only see the image.

That is slick. Real slick. Me like.

WWB

When I used to make flash movies, I always used moock.org detection script which would default to an image file if flash was not detected. I worked great for me then, not sure if it’s still up to date:
http://www.moock.org/webdesign/flash/detection/moockfpi/

I don’t think theres any need to get involved with javascript for this type of thing. And I would say that if flash is disabled then probably javascript is too.
I use a simple technique of setting the background image of the cell where the flash file is embedded, and it works perfect.

Actually, I do apologise, I posted what renderslave has already said. I would say that it is by far the simplest and most effective way.

Actually, it’s not just a concern about flash being disabled or installed, but also if the user has the right flash player version. The script i likned to above should do a number of checks. It will check which flash player in installed, browser type and version, and if javascript is enabled or not.

And what do you suggest if the user does not have javascript enabled?

Hello,

I am also trying to figure out how to have an image load instead of a flash movie, if the flash player is not present or disabled… or of the wrong version.

After reading Steetlife’s simple approach I was a little disappointed because all I saw was a blank white area in the table cell instead of the jpg image I inserted for a background image. I was disapointed because I loved the idea!

I was testing out the web page using Netscape Navigator 4. I figured out that Flash Player version 3 is installed in the browser but my flash movie was designed for flash player 5. It appears that the flash 3 player is displaying a blank white area because it picks up the flash movie but can’t interpret its version 5 format.

I am also wondering what to do if javascript is turned off as well?

The only thing I can think of doing is placing actual content between the OBJECT tags which embeds the flash movie. The content can be as simple as text or image saying flash player version 5 and up is required with a link to the Players download page.

While this is the only thing I can think of… it kind of ruins the look and design of the web page.

I was wondering what everyone thinks of the following as a solution.


Use the javascript code + an image set as the background of a table cell

If Javascript is enabled then the flash movie should just load over the background image if the correct version of flash is present… shouldn’t it?

and If Javascript is not enabled the background image shows… (this image could have some text on it saying flash and or javascript should be enabled to experience the full impact of this site)

Would this work?


Also, is there anyway to do this with DHTML CSS and or Layers… I am not too familiar with layers myself… planning to learn more soon… but can this be done… or does DHTML / Layers require javascript to be enabled?

Finally, don’t the majority of surfers have current versions of Flash Player installed (at least version 5) and don’t most have javascript enabled? Any ideas on the stats on this or any guesses? If it is a high number why not just put some content in NOSCRIPT TAGS and inbetween OBJECT TAGS saying… flash / javascript is required for this site… as sloppy as this may seam I think this may be the lowest common denominator of solutions, not being much of a problem for the majority of surfers viewing the pages.

Any thoughts, solutions, or examples?

Thanks
Eric B


For information on Writing Web Site Proposals that will help you land more jobs, find new clients, and get paid on time click here
.

Sorry, forgot to introduce myself… I’m Eric and the above is my first post. I have lurked here a lot and finally found some time to get involved. Looking forward to interacting with everyone. Thanks

Eric B

The script from moock has all that taken care of. It uses <noscript> if I remember correctly. I recommend trying it out :slight_smile: