JavaScript creates Silverlight plugin and custom nonsilverlight and lowsilverlight styles _javascript tips

Source: Internet
Author: User
Tags object object visibility silverlight
By default, the generated page code might resemble the following code:
Copy Code code as follows:

<! DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 transitional//en" "Http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd ">
<title>IRERTranscript</title>
<style type= "Text/css" >
HTML, Body {
height:100%;
Overflow:auto;
}
Body {
padding:0;
margin:0;
}
#silverlightControlHost {
height:100%;
Text-align:center;
}
</style>
<script type= "Text/javascript" src= "Silverlight.js" ></script>
<script type= "Text/javascript" >
function Onsilverlighterror (sender, args) {
var appsource = "";
if (sender!= null && sender!= 0) {
Appsource = Sender.gethost (). Source;
}
var errortype = args. ErrorType;
var ierrorcode = args. ErrorCode;
if (ErrorType = = "Imageerror" | | | errortype = = "Mediaerror") {
Return
}
var errmsg = "Unhandled Error in Silverlight application" + Appsource + "\ n";
ErrMsg + + "Code:" + ierrorcode + "\ n";
ErrMsg + = "Category:" + errortype + "\ n";
ErrMsg + = "message:" + args. ErrorMessage + "\ n";
if (ErrorType = = "ParserError") {
ErrMsg + = "File:" + args.xamlfile + "\ n";
ErrMsg + = "line:" + args.linenumber + "\ n";
ErrMsg + = "Position:" + args.charposition + "\ n";
}
else if (ErrorType = = "RuntimeError") {
if (args.linenumber!= 0) {
ErrMsg + = "line:" + args.linenumber + "\ n";
ErrMsg + = "Position:" + args.charposition + "\ n";
}
ErrMsg + = "methodname:" + args.methodname + "\ n";
}
throw new Error (errmsg);
}
</script>
<body>
<form id= "Form1" runat= "Server" style= "height:100%" >
<div id= "Silverlightcontrolhost" >
<object data= "data:application/x-silverlight-2," type= "Application/x-silverlight-2" width= "100%" height= "100%" >
<param name= "source" value= "clientbin/example.xap"/>
<param name= "OnError" value= "Onsilverlighterror"/>
<param name= "Background" value= "white"/>
<param name= "minRuntimeVersion" value= "4.0.50401.0"/>
<param name= "AutoUpgrade" value= "true"/>
<a href= "http://go.microsoft.com/fwlink/?LinkID=149156&v=4.0.50401.0" style= "Text-decoration:none" >

</a>
</object><iframe id= "Slexample" style= "visibility:hidden;height:0px;width:0px;border:0px" ></ Iframe></div>
</form>
</body>

We can pass different parameters to object objects, such as XAP package loading address, onload or onerror event handle, background color, minimum version number support, and so on, complete parameter information the reader can refer to the Param parameter list rollup in Silverlight 3. The object object typically contains a <a> tag that shows what to display when the Silverlight plug-in is not installed by the client browser, and we can customize the contents, such as:
Copy Code code as follows:

<object data= "data:application/x-silverlight-2," type= "Application/x-silverlight-2" width= "100%" height= "100%" >
<param name= "source" value= "clientbin/example.xap"/>
<param name= "OnError" value= "Onsilverlighterror"/>
<param name= "Background" value= "white"/>
<param name= "minRuntimeVersion" value= "4.0.50401.0"/>
<param name= "AutoUpgrade" value= "true"/>

<map name= "Nonsilverlight" id= "Nonsilverlight" >
<area shape= "RECT" coords= "154,87,362,183" title= "Get Microsoft Silverlight" href= "http://www.microsoft.com/ Silverlight/resources/install.aspx "target=" _blank "/>
</map>
</object>

When the Silverlight plug-in is not installed in the client browser, the program displays a picture with a hot zone in the appropriate area, where the hot zone points to the Silverlight installation address provided by Microsoft. Theoretically, you can specify any custom code to display the effect of the nonsilverlight, but Silverlight defaults to the effect that is to be displayed in a lower version of Silverlight, which is the case of lowsilverlight.
Silverlight automates forward compatibility, that is, the Silverlight packages that are compiled in a lower version can be run in a high version, instead, the version of the Silverlight package that is compiled in a later edition cannot run under a lower version. At this point the Silverlight plugin displays a default picture that tells the user to upgrade the plugin and pops up a prompt box, as shown below:

Personally feel that this user experience is not very good, just imagine, if the current page has more than Silverlight plug-ins, it is not to pop a number of prompts box? So how to solve this problem? In fact, we can add Silverlight dynamically through JavaScript scripts in addition to rendering Silverlight directly on the page by adding an object tag. The Silverlight.js script provides us with a list of available methods, which you can refer to under MSDN http://msdn.microsoft.com/zh-cn/library/cc838126 (v=vs.95). aspx

And how to add silverlight,http://msdn.microsoft.com/zh-cn/library/cc265155 (v=vs.95) to the page by scripting. aspx

A very detailed example is given on MSDN to show us how to use these scripting methods, and one thing to note, When using silverlight.js files, be sure to conform to the current Silverlight version, or there may be scripting errors, and the corresponding Silverlight.js files can be downloaded from the Microsoft site, and you will find that there are many versions available, including those that support debugging.

There are several issues to be aware of when using the CreateObject method parameters:

1. Parameters are specified in order, and Null can be substituted for arguments that do not need to be passed.

2. The parent element parameter must be specified, that is, the object marked by the parents, you can directly pass the ID of the element as an object, but not in Firefox, you can use document.getElementById (' ElementID ' ) statement instead of the parameter.

3. The Param list is passed by array, and the parameter name is consistent with the name used in the object tag.

4. Event List if there is no corresponding page script to pass the null value, otherwise the script error will be reported.

5. The last parameter context does not need to be omitted, null or NULL.

You should have noticed that when using the CreateObject method we can also specify the nonsilverlight effect for Silverlight, which is specified by the althtml parameter in the Param list, implemented, We can also use the Alt property to specify the Nonsilverlight effect when rendering Silverlight directly on the page using the OBJECT tag, which is the same effect as inserting HTML code directly into the OBJECT tag.
By using the CreateObject method, we can completely customize the lowsilverlight effect, and here's an example:

Copy Code code as follows:

<div id= "Divsilverlightcontent" >
<script type= "Text/javascript" >
if (silverlight.isinstalled ("4.0.50303.0")) {
Silverlight.createobject ("Clientbin/silverlightapplication1.xap",
document.getElementById (' divsilverlightcontent '),
Null
{width: "532px", Height: "380px", Background: "White", Version: "4.0.50303.0", Windowless: "true"},
Null
"Param1=value1,param2=value2");
}
else {
document.write (' '
+ ' <map name= ' nonsilverlight ' id= ' nonsilverlight ' > '
+ ' <area shape= ' RECT "coords=" 154,87,362,183 "title=" Get Microsoft Silverlight "href=" http://www.microsoft.com/ Silverlight/resources/install.aspx "target=" _blank "/>"
+ ' </map> ');
}
</script>
<iframe style= ' Visibility:hidden; height:0; width:0; border:0px ' ></iframe>
</div>

Use the silverlight.isinstalled () method to determine whether the client browser has a specified version of the Silverlight plug-in installed, if it is already installed, The Silverlight object is created using the Silverlight.createobject method, otherwise the custom content is output.

Here is also an article personally feel very useful, to share it with you!

Http://www.itstrike.cn/Question/Use-JavaScript-to-create-Silverlight-Object-createObject

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.