Good open-source tool swfobject-it makes it easy for us to embed flash on the web page, and has strong compatibility and is conducive to Seo

Source: Internet
Author: User

What is swfobject?

 

It is an open-source JavaScript tool class, which can be easily found on Google Code: http://code.google.com/p/swfobject /. It provides a unified way for us to easily embed Flash content into webpages without considering the special markup of any platform or browser and their support for flash. Whether you are developing pages, Flash, or JS, you can find a suitable method to embed Flash content. Second, it also provides some APIs that allow you to detect the information supported by the current browser for flash, so that you can easily complete your logic. According to the official saying, the file is only 10 KB and only 3.9 kb after gzip.

 

How to embed flash into a page using swfobject?

 

It provides two methods: static embedding and dynamic embedding.

Static embedding: it uses HTML tags to embed Flash content and alternative content, and then uses JavaScript to implement functions such as detection, compatibility, and dynamic replacement that cannot be completed by tags.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<SCRIPT type = "text/JavaScript" src = "swfobject. js"> </SCRIPT>

<SCRIPT type = "text/JavaScript">
Swfobject. registerobject ("myid", "9.0.115", "expressinstall.swf ");
</SCRIPT>

<Object ID = "myid" classid = "CLSID: D27CDB6E-AE6D-11cf-96B8-444553540000" width = "780" Height = "420">

<Param name = "movie" value = "mycontent.swf"/>

<! -- [If! IE]> -->


<Object type = "application/X-Shockwave-flash" Data = "mycontent.swf" width = "780" Height = "420">


<! -- <! [Endif] -->

<P> alternative content </P>


<! -- [If! IE]> -->

</Object>

<! -- <! [Endif] -->

</Object>

  </div>  </body>

The previous code is directly drawn from the official documentation. In general, this method is embedded in three steps:

1. Use HTML to embed flash and alternative content, where the purple code is. We can see the peripheral OBJECT tag, which is for IE. We use the param tag to specify some of its parameters. The object tag of the content is for other browsers, the flash Address should also be specified here, and there is an alternative content marked as <p>, which is a highlight of the JS tool. First of all, if the browser does not support flash, it can display the content here to ensure that your page is complete and controllable under any circumstances. Second, we all know that the search engine cannot index the content in flash. we add the content you want to index in the alternative content, which is more conducive to Seo.

2. Introduce the JS file in blue code.

3. In the red code area, tell JS that you want it to help you complete the compatibility and other work tags. The first parameter is to mark the Object ID, and the second is the flash version number you requested, is by major. minor. release. in the form of build, JS only requires the first three versions. If it is a 9th major version, use 9 instead of 9.0.0. The third parameter is optional. It displays the Flash content displayed when a specific version is downloaded if the version is not supported. This solution contains a flash, which can also be customized. In fact, there is also an optional parameter for passing a callback function, whether it is called at the completion of loading, whether it is successful or failed to call.

You can repeat code 1 and 3 to embed more Flash content.

Dynamic embedding: you only need to add alternative content, and then JS will help you complete flash embedding (the current browser does not support disabling JS, and Flash is also available ).

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<SCRIPT type = "text/JavaScript" src = "swfobject. js"> </SCRIPT>

<SCRIPT type = "text/JavaScript">
Swfobject. embedswf ("mycontent.swf", "mycontent", "300", "120", "9.0.0 ");
</SCRIPT>

<Div id = "mycontent">
<P> alternative content </P>
</Div>

  </body>

The first step is to replace the content in the purple code.

Step 2: Introduce JS and blue code.

Step 3: Call. The first parameter is the embedded flash content, the second parameter replaces the Content ID, the third and fourth flash width and height, the fifth required version number, 6th optional, for the animation displayed during download, the actual flash vars parameter and the 7th optional Params parameter must be added, 9th optional attribute parameters for the object to be added, 10th optional, callback function.

The 7, 8, and 9 parameters are supported.

var flashvars = {};flashvars.name1 = "hello";flashvars.name2 = "world";flashvars.name3 = "foobar";var params = {};params.menu = "false";var attributes = {};attributes.id = "myDynamicContent";attributes.name = "myDynamicContent";

In this form, you can also upload {}. For more details, go to Google Code.

 

The Simple Method for embedding flash is described here, but the swfobject function is not only so. Other APIs provided by swfobject allow you to easily implement selective embedding.

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.