|
|
Dynamic Object Embedding and allowing ActiveX Content in Intenet Explorer
In the latest releases of Internet Explorer Flash movies don't start to play, when they are embedded using <object> tag:
- There is noplug-in detection. - With no plug-in detection, users may see broken or no content, and if there is no plug-in installed at all, they will either get the 'ActiveX install' dialog box on IE —a box many users now fear because of rampant spyware and malware— or the 'strange puzzle piece' box in Mozilla based browsers. Neither of these plug-in install systems are very user friendly, and usually don't explain themselves very well as to what exactly a user is installing.
- With changes from the Eolas patent dispute, users will have to first click on your Flash content to 'activate' it before interacting with it.
- It is not valid HTML or XHTML - There is no such thing as an embed tag in any version of HTML or XHTML. However, since many browsers handle object tags differently (or not at all, or the implementation is too buggy), the embed tag was needed as a fallback mechanism.
Problem case
Here is a sample Flash content embedding, when the problems described earlier will occur:
<html>
<head><title>AnyChart Sample</title></head>
<body>
<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="550" height="400" align="middle"><param name="allowScriptAccess" value="sameDomain" id="anychart"/>
<param name="movie" value="./swf/2DColumn.swf?XMLFile=source.xml" />
<param name="quality" value="high" />
<param name="bgcolor" value="#ffffff" />
<embed name = "anychart" src="./swf/2DColumn.swf?XMLFile=source.xml" quality="high" bgcolor="#ffffff" width="550" height="400" align="middle" allowScriptAccess="sameDomain" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" />
</object>
</body>
</html>
|
Problem case
To solve the problems we will use JavaScript.
1. Include AnyChart.js (right click to save it on your PC) file in your page:
<html>
<head><title>AnyChart Sample</title></head>
<script type="text/javascript" language="javascript" src="AnyChart.js"></script>
<body>
</body>
</html>
|
2. Add a <div> element to the place where Flash movie should be inserted:
<html>
<head><title>AnyChart Sample</title></head>
<script type="text/javascript" language="javascript" src="AnyChart.js"></script>
<body>
<div id="flashContent"></div>
</body>
</html>
|
3. After <div> description add JavaScript which would embed Flash movie:
<html>
<head><title>AnyChart Sample</title></head>
<script type="text/javascript" language="javascript" src="AnyChart.js"></script>
<body>
<div id="flashContent"></div>
<script type="text/javascript" language="javascript">
var anyChart = new AnyChart('./swf/2DColumn.swf','./source.xml', 'chart0',700,500);
anyChart.write('flashContent');
</script>
</body>
</html>
|
Settings for the "AnyChart" object constructor are the following:
AnyChart(path, dataxml, id, width, height, color);
path - path to swf file
dataxml - sets a path to xml settings file (can be an address of script with url parameters)
id - id attribute, that should be assigned to newly created element
width - movie width
height - movie height
color - background color
Methods:
write(target) - outputs a html ащк Flash embeding.
target - id of the element or link to the element
Note: javascript should be called onload event of <body> tag, or after <div> description - not before.
Final
Test page is available here: jsEmbed.htm
|
