What is the role of this JS?

Source: Internet
Author: User

Recently I have seen several Flash websites, and a swfobject. js is loaded in the head code. What is the role of this JS? A Web page is being created, which may be useful. So I searched it out curiously. It was originally developed by a foreigner and used to insert Adobe Flash Media resources (*. swf file) Independent and agile JavaScript module. the JavaScript script in this module can automatically detect the support of Flash plug-ins by mainstream browsers on PCs and Mac machines. The latest version is 2.2. You can download the latest version of SWFObject:
Http://code.google.com/p/swfobject/

I found that it has many benefits:
1. There is no annoying dotted box in IE.
2. provides a complete version detection function. if the version is not enough, other things are displayed, such as slices or texts.
3. easy to use, as long as one is loaded in the page header. js file, and then HTML Write a container, put common text or images in it (used when Flash cannot be displayed), and finally use the script to replace the content in this element with Flash.
4. Make it as simple and secure as possible to insert Flash Media resources. In addition, it is very consistent with the search engine optimization principles.
5. Avoid non-standard tags such as object and embed in HTML and XHTML to conform to more standards.


You only need to include the Javascript file swfobject. js and insert some simple js Code into the DOM to embed Flash Media resources. The following is a simple example:

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

<Div id = "flashcontent">
This text is replaced by the Flash movie.
</Div>

<Script type = "text/javascript">
Var so = new SWFObject ("movie.swf", "mymovie", "200", "100", "7", "#336699 ");
So. write ("flashcontent ");
</Script> let's see how the code works.

<Div id = "flashcontent"> [...] </div> first, we need to reserve an HTML node for the SWF resource. All content in this HTML node will be replaced by Flash resources on the client. When Flash player is not installed on the client, the content will be displayed. This feature is essential for SEO and user experience.

Var so = new SWFObject (swf, id, width, height, version, background-color [, quality, xiRedirectUrl, redirectUrl, detectKey]); Create a new SWFObject instance, and input the following parameters:

Swf-SWF file path
Id-the id value you allocated to the SWF file. It is used to set the name attribute for the embed and object labels, so as to support the swliveconnect function, such as dynamically passing Variables
Width-width
Height-height
Version-the version number required by Flash Player. It can be detailed in 'major version number. Minor version number. details', for example, "6.0.65 ". Generally, you only need to input the main version, for example, "6 ".
Background-color-background color of Flash resources, in hexadecimal format
In addition, the following optional parameters are available:

Quality-image quality. The default value is "high ".
XiRedirectUrl-see ExpressInstall
RedirectUrl-the target address that is automatically redirected after the player of the corresponding version is not installed
DetectKey-this is the variable to be searched in the url address when the detection is ignored. The default value is "detectflash ".
So. write ("flashcontent"); apply the Flash resource to the DOM and display it in the browser.

SWFObject

<Script type = "text/javascript">
</Script>

Multiple parameters are added to achieve each effect. There are many parameters, but only a little bit is needed. Let's take a look at this Code:

<Script type = "text/javascript" src = "swfobject. js"> </script>
<Script type = "text/javascript">
Var so = new SWFObject ("movie.swf", "mymovie", "400", "100%", "8", "#336699 ");
So. addParam ("quality", "low ");
So. addParam ("wmode", "transparent ");
So. addParam ("salign", "t ");
So. addVariable ("variable1", "value1 ");
So. addVariable ("variable2", "value2 ");
So. addVariable ("variable3", "value3 ");
So. addVariable ("variable1", getQueryParamValue ("variable1 "));
So. addVariable ("variable2", getQueryParamValue ("variable2 "));
So. write ("flashcontent ");
</Script>

This Code provides common SWFObject parameters:

Var so = new SWFObject (swf, id, width, height, version, background-color [, quality, xiRedirectUrl, redirectUrl, detectKey]);
So. addParam ("Param1", "Param2 ");
So. addParam ("Param3", "Param4 ");
So. addParam ("Param5", "Param6 ");
So. addVariable ("variable1", "value1 ");
So. addVariable ("variable2", "value2 ");
So. addVariable ("variable3", "value3 ");
So. addVariable ("variable1", getQueryParamValue ("variable1 "));
So. addVariable ("variable2", getQueryParamValue ("variable2 "));
So. write ("content ");

Explain the functions of these parameters:

Var so = new SWFObject (swf, id, width, height, version, background-color [, quality, xiRedirectUrl, redirectUrl, detectKey]); // This is a basic parameter required by SWFObject. All SWFObject must contain this parameter.
So. addParam ("Param1", "Param2"); // Add inline parameters to Flash to achieve effects such as background transparency. Add as needed. The parameters and the emded/object Tag are the same code, the same below.
So. addParam ("Param3", "Param4 ");
So. addParam ("Param5", "Param6 ");
So. addVariable ("variable1", "value1"); // Add FlashVar to Flash, which is used to add a variable to the Root of Flash in FlashVar mode, type conversion is required for Number variables on the Flash end.
So. addVariable ("variable2", "value2 ");
So. addVariable ("variable3", "value3 ");
So. addVariable ("variable1", getQueryParamValue ("variable1"); // obtain URL variables in Flash for url? Arg1 = test1 & arg2 = test2 and pass the variable URL in GET mode. We can use the getQueryParamValue method to GET the variable.
So. addVariable ("variable2", getQueryParamValue ("variable2 "));
So. write ("content"); // This is a crucial part. It replaces the content when Flash cannot be displayed with a specific piece of content. You can define the style in CSS in advance and use the div label in the document to write it out. It is called here.


From falling in love with Ding man

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.