swf(flash) plays automatically in chrome - google-chrome

I embed the swf file by swfobject. I do not want the swf file(it's an advertisement) play automatically, so I set the attribute of play with "false". as following html:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<script type="text/javascript" src="swfobject/swfobject.js"></script>
<script type="text/javascript">
swfobject.registerObject("myFlashContent", "9.0.0", "expressInstall.swf");
</script>
</head>
<body>
<div>
<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="970" height="250" id="myFlashContent">
<param name="movie" value="day_110702/ad.swf" />
<param name="play" value="false" />
<!--[if !IE]>-->
<object type="application/x-shockwave-flash" data="day_110702/ad.swf" width="970" height="250">
<!--<![endif]-->
<a href="http://www.adobe.com/go/getflashplayer">
<img src="http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif" alt="Get Adobe Flash player" />
</a>
<!--[if !IE]>-->
</object>
<!--<![endif]-->
</object>
</div>
</body>
</html>
It works perfectly on IE but it doesn't work on Chrome/Firefox. In Chrome/Firefox the swf file plays automatically.
In addition, another behavior of swf file differ from Chrome/Firefox and IE is:
when you embedded the swf file with invisible iframe tag. as
<iframe id="iframe" src="swf.html" style="width:100%;height:100%; display:none; visibility:hidden;"></iframe>
When you browse the page that contains this iframe in IE/Firefox, the swf will NOT play until you make iframe visible. But if yo browse the page in Chrome, the swf will play automatically even if iframe is invisible.
Anyone can tell me why the swf(flash) behavior is differ in different browsers?
Cross-browsers problem always make crazy :).

Have you tried embedding the SWF using dynamic publishing instead of static publishing?
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<script type="text/javascript" src="swfobject.js"></script>
<script type="text/javascript">
var flashvars = {};
var params = {};
params.play = "true";
var attributes = {};
swfobject.embedSWF("day_110702/ad.swf", "myAlternativeContent", "970", "250", "9.0.0", false, flashvars, params, attributes);
</script>
</head>
<body>
<div id="myAlternativeContent">
<a href="http://www.adobe.com/go/getflashplayer">
<img src="http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif" alt="Get Adobe Flash player" />
</a>
</div>
</body>
</html>

Related

Adjusting width of flash content without changing aspect ratio

I want to maintain width of 600 px and height be adjusted accordingly in order to maintain aspect ratio. How can that be achieved?
I m using following code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script type="text/javascript" src="swfobject.js"></script>
<script type="text/javascript">
swfobject.registerObject("myFlashContent", "9.0.0");
</script>
</head>
<body>
<div>
<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="600" id="myFlashContent">
<param name="movie" value="swffile.swf" />
<!--[if !IE]>-->
<object type="application/x-shockwave-flash" data="swffile.swf" width="600">
<!--<![endif]-->
<a href="http://www.adobe.com/go/getflashplayer">
<img src="http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif" alt="Get Adobe Flash player" />
</a>
<!--[if !IE]>-->
</object>
<!--<![endif]-->
</object>
</div>
</body>
</html>

HTML linked image for email signatures?

Everything works fine for Microsoft Outlook, but when the .html file is inserted to Mac Outlook 2011 the image shows up but the link does not show up. Been searching on the web for a while and couldn't fine an answer. My fault or the Macs?.
Wat do?.
Here's my code:
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Link</title>
</head>
<body>
<a href="http://issuu.com/3foxinternational/docs/gw_complete" target="_blank">
<img src="http://i.imgur.com/QmTzKiY.jpg" alt="site link" />
</a>
</body>
</html>
Microsoft Outlook is a real PITA sometimes when it comes to viewing HTML emails. The rending engine is terrible. Also, it doesn't support HTML5.
HTML emails should always be written using very old coding standards so that they are cross email client compatible. Try this:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="viewport" content="width=device-width"/>
<title>Link</title>
</head>
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
<a href="http://issuu.com/3foxinternational/docs/gw_complete" target="_blank">
<img src="http://i.imgur.com/QmTzKiY.jpg" alt="site link" border="0" style="display:block;" />
</a>
</body>
</html>

Is it possible to use YouTube video with HTML video tag?

I'm making website and I need to add video, but not using iframe. Video tag doesn't have this ability I guess, maybe there are some simple alternatives?
Have you tried this code ?
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252" />
<title>HTML5 MediaElement - YouTube</title>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script src="http://mediaelementjs.com/js/mejs-2.13.1/mediaelement-and-player.min.js"></script>
<link rel="stylesheet" href="http://mediaelementjs.com/js/mejs-2.13.1/mediaelementplayer.min.css" />
</head>
<body>
<h1>MediaElementPlayer.js</h1>
<h2>YouTube Wrapper</h2>
<video width="640" height="360" id="player1">
<!-- Pseudo HTML5 -->
<source type="video/youtube" src="http://www.youtube.com/watch?v=nOEw9iiopwI" />
</video>
<span id="player1-mode"></span>
<script>
$('video').mediaelementplayer({
success: function(media, node, player) {
$('#' + node.id + '-mode').html('mode: ' + media.pluginType);
}
});
</script>
</body>
</html>
More info at http://mediaelementjs.com

HTML5 Video for mobile

I'm having some issues with video for mobile and HTML5. My biggest problem is that the video will play like 2 seconds and stop because not enough of the video has loaded. The video is 1:26s long and 9mb. I was testing on wifi. Is there a way that I can make the video wait til enough has loaded so it can play without issues? or what is my best option to help solve this?
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1 /DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Untitled Document</title>
<script type="text/javascript">
</script>
<style type="text/css">
<!--
body {
margin: 0px;
padding: 0px;
background-color:#000;
}
-->
</style>
</head>
<body>
<!--<div id = "m_loader">
<div id = "loading_hold">
<img src="d_logo.png" width="365" height="500" />
</div>
</div>-->
<video controls="controls" autoplay="autoplay">
<source src="reel720_3.mp4" type="video/mp4" />
<source src="reel720_3.webm" type="video/webm" />
Your browser does not support the video tag.
</video>
</body>
You can use the "canplaythrough" event. Though you may want to show some sort of progress/download indicator while this is happening.
myVideo.addEventListener('canplaythrough', function() {
myVideo.play();
});

Loading swf on IE html

<div>
<object id="myMovieName" classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000">
<param value="/media/camera.swf" name="movie">
<param value="high" name="quality">
<param value="#FFFFFF" name="bgcolor">
<embed align=""
type="application/x-shockwave-flash"
name="myMovieName"
bgcolor="#FFFFFF"
quality="high"
src="/media/camera.swf"
href="/media/camera.swf">
</object>
</div>
the swf file doesnt load in IE what am i doing wrong here
I really think you should use swfobject. Download it from here:
http://code.google.com/p/swfobject/downloads/detail?name=swfobject_2_2.zip&can=2&q=
Then get the expressinstall.swf and the swfobject.js file.
Here is an example code for your stuff:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>SWFObject example</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="language" content="en" />
<meta name="description" content="" />
<meta name="keywords" content="" />
<script type="text/javascript" src="js/swfobject.js"></script>
<script type="text/javascript">
var fo = new Object();
function initFlash()
{
fo.flashvars = {};
fo.params = {
allowScriptAccess: "sameDomain"
};
fo.attributes = {};
swfobject.embedSWF("smedia/camera.swf", "flashcontent", "100%", "100%", "10,1,103", "media/expressInstall.swf", fo.flashvars, fo.params, fo.attributes);
}
</script>
</head>
<body>
<div id="flashcontent">Flash will be placed here by swfobject.</div>
</div>
<script type="text/javascript">initFlash();</script>
</body>
</html>
You can read more about how it works in the documentation.
Rob