Have Flash Display Alternate Content for Smartphone browsers

  • Resolved jderosa3

    (@jderosa3)


    15 years, 7 months ago

    I want my site to display properly for iPhones and other smart phones that cannot display flash content.

    I am trying to have the web browser display alternate content if Flash is not available. I have found SWFobject to be the best so far, but I have one issue with this. The site seems to function normally in both Safari and Firefox, but not IE. Safari and Firefox display the flash fine and if I disable the flash pluginit displays the image I have specified, but Internet explorer (both 7 and 8) will only show the image and ignore the flash.

    Here is my code:

    <script type="text/javascript" src="https://redtablegroup.com/js/swfobject.js"></script>

<object width="641" height="281" id="myFlashContent">
				<param name="movie" value="https://www.xxx.com/wp-content/uploads/sample.swf" /><param name="wmode" value="transparent"> <param name="quality" value="high" /><param name="scale" value="noscale" />
				<!--[if !IE]>-->
				<object type="application/x-shockwave-flash" data="https://www.xxx.com/wp-content/uploads/sample.swf" width="641" height="281">
				<!--<![endif]-->
					<img src="https://www.xxx.com/images/about-header.jpg" alt="About XXX" />
				<!--[if !IE]>-->
				</object>
				<!--<![endif]-->
			</object>

    I came across another Flash Satay code, but this broke the flash playback all together in all browsers:

    <!--[if !IE]> -->
<object type="application/x-shockwave-flash"
  data="https://www.redtablegroup.com/wp-content/uploads/rtg-about-as3.swf" width="641" height="281">
<!-- <![endif]-->

<!--[if IE]>
<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"
  codebase="https://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,0,0"
  width="641" height="281">
  <param name="movie" value="https://www.xxx.com/wp-content/uploads/sample.swf" />
<!--><!--dgx-->
  <param name="movie" value="https://www.xxx.com/wp-content/uploads/sample.swf" />
  <param name="wmode" value="transparent">
  <param name="quality" value="high" />
  <param name="scale" value="noscale" />

  <p><img src="https://www.xxx.com/images/about-header.jpg" alt="About" /></p>
</object>
<!-- <![endif]-->

    I dont think this really matters but I am doign this in static wordpress pages… keep in mind I have other items working in these pages with no issues… this includes PHP scripts as well as other items… and I have WordPress setup to not edit the code I place. Although I thought I should pass this info along.

    Can someone point me to some sample code or a plugin that has been tried and true… I can’t figure out what is wrong…

Viewing 4 replies - 1 through 4 (of 4 total)
  • Thread Starter jderosa3

    (@jderosa3)

    got it to work… put the JS refernce in the header.php file of the template and then used this code:

    FireFox 3 is displaying on the page “->” where the Flash should be… It looked like a broken tag… but I don’t think so – here is my code:

    <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="641" height="281" id="myFlashContent">
				<param name="movie" value="https://www.xxx.com/wp-content/uploads/about.swf" />
				<param name="loop" value="false" />
				<param name="quality" value="high" />
				<param name="scale" value="noscale" />
				<param name="wmode" value="transparent" />
				<param name="allowfullscreen" value="false" />
				<!--[if !IE]>-->
				<object type="application/x-shockwave-flash" data="https://www.xxx.com/wp-content/uploads/about.swf" width="641" height="281">
					<param name="loop" value="false" />
					<param name="quality" value="high" />
					<param name="scale" value="noscale" />
					<param name="wmode" value="transparent" />
					<param name="allowfullscreen" value="false" />
				<!--<![endif]-->
<img src="https://www.xxx.com/images/about-header.jpg" alt="About Us" />
					<!--[if !IE]>-->
				</object>
				<!--<![endif]-->
			</object>

    This code works perfect in IE and also Safari, but not FireFox (3)… any ideas?

    Thread Starter jderosa3

    (@jderosa3)

    I do have a flash object in my home page with the following code that
    works fine in Firefox…

    <object width="641" height="510" data="https://www.xxx.com/
flash/home-text.swf" type="application/x-shockwave-flash"><param
name="wmode" value="transparent"> <param name="quality" value="high" /
><param name="scale" value="noscale" /><param name="src" value="https://

www.xxx.com/flash/home-text.swf" /></object>

    but my code in the first post is something firefox does not like… im
    confused…

    Thread Starter jderosa3

    (@jderosa3)

    Ok… I know have firefox displaying the alternate content but not the Flash object… My IE code was incorrect.

    I had:
    <!--[if !IE]>--> HTML <!--<![endif]-->

    It was suppose to be:
    <!--[if IE]> HTML <![endif]-->

    Resulting code now looks like:

    <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="642" height="286" id="myFlashContent">
				<param name="movie" value="https://www.xxx.com/flash/contact-header.swf" />
				<param name="loop" value="false" />
				<param name="quality" value="high" />
				<param name="scale" value="noscale" />
				<param name="wmode" value="transparent" />
				<param name="allowfullscreen" value="false" />
				<!--[if IE]>
				<object type="application/x-shockwave-flash" data="https://www.xxx.com/flash/contact-header.swf" width="642" height="286">
					<param name="loop" value="false" />
					<param name="quality" value="high" />
					<param name="scale" value="noscale" />
					<param name="wmode" value="transparent" />
					<param name="allowfullscreen" value="false" />
				<![endif]-->
					<img src="https://www.xxx.com/images/contact-header.jpg" alt="Contact Us" />
				<!--[if IE]>
				</object>
				<![endif]-->
			</object>

    Any final thoughts on this?

    Thread Starter jderosa3

    (@jderosa3)

    Finally got it all working… IE, Safari, Firefox and iPhone: here is the new code:

    <script type="text/javascript" src="https://www.xxx.com/js/
swfobject.js"></script>
                <script type="text/javascript">
                        var flashvars = {};
                        var params = {};
                        params.quality = "high";
                        params.scale = "noscale";
                        params.wmode = "transparent";
                        var attributes = {};
                        swfobject.embedSWF("https://www.xxx.com/flash/contact-header.swf",
"myAlternativeContent", "642", "286", "9.0.0", false, flashvars,
params, attributes);
                </script>
                <div id="myAlternativeContent">
                        <a href="https://www.adobe.com/go/getflashplayer">
                                <img src="https://www.adobe.com/images/shared/download_buttons/
get_flash_player.gif" alt="Get Adobe Flash player" />
                        </a>
                </div>
Viewing 4 replies - 1 through 4 (of 4 total)
  • The topic ‘Have Flash Display Alternate Content for Smartphone browsers’ is closed to new replies.