我们在使用Visual Studio IDE创建Silverlight工程时,默认情况下都会自动生成一个用于调试和预览Silverlight的Web工程,该工程包含了html和aspx页面,以及Silverlight.js脚本文件。默认情况下,生成的页面代码可能与下面的代码类似:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><htmlxmlns="http://www.w3.org/1999/xhtml"><head><title>IRERTranscript</title><styletype="text/css">html, body{height:100%;overflow:auto;}body{padding:0;margin:0;}#silverlightControlHost{height:100%;text-align:center;}</style><scripttype="text/javascript"src="Silverlight.js"></script><scripttype="text/javascript">functiononSilverlightError(sender, args) {varappSource="";if(sender!=null&&sender!=0) { 
              appSource
=sender.getHost().Source; 
            }
varerrorType=args.ErrorType;variErrorCode=args.ErrorCode;if(errorType=="ImageError"||errorType=="MediaError") {return
            }
varerrMsg="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"
            }
elseif(errorType=="RuntimeError") {if(args.lineNumber!=0) { 
                    errMsg
+="Line:"+args.lineNumber+"\n"
                    errMsg
+="Position:"+args.charPosition+"\n"
                } 
                errMsg
+="MethodName:"+args.methodName+"\n"
            }
thrownewError(errMsg); 
        }
</script></head><body><formid="form1"runat="server"style="height:100%"><divid="silverlightControlHost"><objectdata="data:application/x-silverlight-2,"type="application/x-silverlight-2"width="100%"height="100%"><paramname="source"value="ClientBin/example.xap"/><paramname="onError"value="onSilverlightError"/><paramname="background"value="white"/><paramname="minRuntimeVersion"value="4.0.50401.0"/><paramname="autoUpgrade"value="true"/><ahref="http://go.microsoft.com/fwlink/?LinkID=149156&v=4.0.50401.0"style="text-decoration:none"><imgsrc="http://go.microsoft.com/fwlink/?LinkId=161376"alt="Get Microsoft Silverlight"style="border-style:none"/></a></object><iframeid="slExample"style="visibility:hidden;height:0px;width:0px;border:0px"></iframe></div></form></body></html>

  我们可以给object对象传递不同的参数,如xap包的加载地址,onLoad或onError事件句柄,背景色,最小版本号支持等等,完整的参数信息读者可以参考Silverlight 3中param参数列表汇总。object对象中一般会包含一段<a>标记,是用来显示当客户端浏览器未安装Silverlight插件时要显示的内容的,我们可以自定义其中的内容,如:

<objectdata="data:application/x-silverlight-2,"type="application/x-silverlight-2"width="100%"height="100%"><paramname="source"value="ClientBin/example.xap"/><paramname="onError"value="onSilverlightError"/><paramname="background"value="white"/><paramname="minRuntimeVersion"value="4.0.50401.0"/><paramname="autoUpgrade"value="true"/><imgsrc="/images/NonSilverlight.jpg"style="border-style: none"usemap="#NonSilverlight"/><mapname="NonSilverlight"id="NonSilverlight"><areashape="RECT"coords="154,87,362,183"title="Get Microsoft Silverlight"href="http://www.microsoft.com/silverlight/resources/install.aspx"target="_blank"/></map></object>

  当客户端浏览器未安装Silverlight插件时,程序会在相应的区域显示一张带有热区的图片,热区指向的位置是Microsoft提供的Silverlight安装地址。理论上,你可以指定任何的自定义代码来显示nonSilverlight的效果,但是Silverlight默认没有提供低版本Silverlight情况下要显示的效果,也就是lowSilverlight的情况。

  Silverlight可以自动实现向前兼容,也就是在低版本下编译的Silverlight包可以在高版本下运行,相反,在高版本下编译的Silverlight包不能再低版本下运行,此时Silverlight插件会显示一张默认的图片用来告知用户升级插件,并弹出一个提示框,如下图:

  个人觉得这种用户体验并非很好,试想,如果当前页面上有多个Silverlight插件,岂不是要弹出多个提示框吗?那么如何来解决这个问题呢?事实上,我们除了直接在页面上添加object标记来呈现Silverlight外,还可以通过javascript脚本来动态添加Silverlight。Silverlight.js脚本为我们提供了一系列可用的方法,详细内容大家可以参考下msdn http://msdn.microsoft.com/zh-cn/library/cc838126(v=VS.95).aspx#isinstalled

  以及如何通过脚本在页面上添加Silverlight,http://msdn.microsoft.com/zh-cn/library/cc265155(v=VS.95).aspx

  msdn上给出了非常详细的例子来告诉我们如何使用这些脚本方法,有一点需要注意,使用Silverlight.js文件时一定要与当前Silverlight版本相一致,否则可能会有脚本错误,对应的Silverlight.js文件可以在微软的站点上下载,你会发现其实有很多个可用的版本,其中还包括支持调试的版本哦。

  createObject方法参数在使用的时候有几个问题需要注意下:

  1. 参数按顺序指定,如果有不需要传递的参数可用null代替。

  2. parent element参数必须指定,也就是object标记的父元素,可直接将元素的id当做对象传入,但是在Firefox中不支持,此时可以使用document.getElementById('elementId')语句代替该参数即可。

  3. param列表通过数组传递,参数名称与在object标记中使用的名称保持一致即可。

  4. 事件列表如果没有对应的页面脚本则传null值,否则会报脚本错误。

  5. 最后一个参数context如果不需要可以省去,不用传null或空值。

  你应该注意到了,在使用createObject方法时我们可以顺便给Silverlight指定nonSilverlight效果,这个是通过param列表中的altHtml参数来指定的,实施上,我们在页面上直接使用object标记呈现Silverlight时也可以使用alt属性来指定nonSilverlight效果,这个与在object标记中直接插入html代码的效果相同。

  通过使用createObject方法,我们完全可以自定义lowSilverlight效果了,下面是一个例子:

<divid="divSilverlightContent"><scripttype="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(
'<img src="data:images/NonSilverlight.jpg" style="border-style: none" usemap="#SLMap3D_NonSilverlight" />'+'<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><iframestyle='visibility:hidden; height: 0; width: 0; border: 0px'></iframe></div>

  使用Silverlight.isInstalled()方法可以判断客户端浏览器是否已经安装了指定版本的Silverlight插件,如果已经安装了,则使用Silverlight.createObject方法创建Silverlight对象,否则输出自定义的内容。

  这里还有一篇文章个人觉得很有用,给大家分享下吧!

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

本文转自Jaxu博客园博客,原文链接:http://www.cnblogs.com/jaxu/archive/2010/06/28/1766804.html,如需转载请自行联系原作者

Javascript创建Silverlight Plugin以及自定义nonSilverlight和lowSilverlight样式相关推荐

  1. 创建Silverlight自定义启动画面

    每一款商业的Silverlight项目,为了体现项目个性化,都会有不同的界面设计,项目UI设计的第一步就是创建个性的自定义启动画面,本文将介绍如何创建Silverlight自定义启动画面,也就是经常说 ...

  2. 使用jQuery来创建Silverlight

    使用jQuery来创建Silverlight jQuery已经成为了VS2010内置支持的JavaScript脚本框架了,小巧实用.这里看看怎么用jQuery来在页面中创建一个Silverlight. ...

  3. 创建Silverlight 1.0 開發環境

    建置 Silverlight 1.0 開發環境 摘至网络 MSN Space.Google Doc .Google Blog Chui-Wen Chiu 2007.07.26 下載 1. Sliver ...

  4. python爬silverlight_Python创建Silverlight控件编写过程经验分享

    Python编程语言可以帮助我们实现哪些功能呢?它的主要应用范围都包括哪些呢?我们今天先来了解一下有关Python创建Silverlight控件的相关实现方法,以此来初步熟悉一下这一语言的应用方式以及 ...

  5. 使用createObject(createObjectEx)创建silverlight对象

    在我们正常创建的silverlight Application项目之后,会在相应的web文件夹中生成两个名称相同但扩展名 分别为aspx和html和页面. 其中的aspx页面是我们所熟悉的控件声明方式 ...

  6. 不用js也能创建silverlight

    如果你已经安装了silverlight并能在IE7或Firefox 2中运行,请直接复制下边的代码存成.htm来浏览. <html> <head> </head> ...

  7. 使用 Vanilla JavaScript 创建 Web 组件

    Web 应用程序开发是一个非常拥挤的技术领域.有不同类型的框架.库和工具.在开发 Web 应用程序时,主要目标是提供带有封装组件的高质量用户界面 (UI). 因此,当您使用 React.Vue.Ang ...

  8. [演练]使用Expression Blend或代码创建Silverlight时钟

    本演练分步讲述如何使用 Microsoft Silverlight 创建一个简单时钟.下图所示为您将创建的时钟. 运行此示例. 下载此示例. 组成此时钟外观的向量图形是使用可扩展应用程序标记语言 (X ...

  9. VS2008正式版创建silverlight项目失败的解决办法

    安装microsoft express blend2 最新的试用版时,说请安装.net framework3.5 或更新的版本,我一想,我装了vs2008 beta2,有3.5呀, 于是我就下了个vs ...

最新文章

  1. eoiioe IE 和 firefox js 兼容问题
  2. php验证码切换不刷新页面,Yii2解决验证码点击、刷新页面不刷新问题
  3. lisp 绘制立体感的五角星_[原创]圆内加五角星lsp代码,详细有注解
  4. L3-2 至多删三个字符
  5. 网页设计上机考试原题_Dreamweaver上机考试题目dreamweaver试题库网页制作试题.doc...
  6. 1-3-顺时针旋转矩阵
  7. c程序设计语言读书笔记,C程序设计语言读书笔记
  8. python高段编程_25个有用的 Python 代码段
  9. FastDFS实现原理及流程
  10. 【蓝牙】室内外定位技术-钛斗™星地融合定位系统
  11. 第四章 数据库安全性总结
  12. 第30集丨本来的面目:认识你自己
  13. linux下,Telnet连接输入正确的用户名和密码后,却还一直提示输用户名和密码,解决方案。
  14. 主动访问用户数据 ——被站长忽视的内容
  15. php开发俄罗斯方块,HTML5+JS实现俄罗斯方块原理及具体步骤_html5教程技巧
  16. 说不玩但是我还是玩了..
  17. 详细设计说明书(转载)
  18. Android开发入门与实战之Android应用安装卸载
  19. Android 网络请求库Retrofit简单使用
  20. [普通物理]波的能量与干涉

热门文章

  1. 威驰fs高配和低配有什么区别_“电子手刹”和“机械手刹”的区别有多大?很多车主不清楚...
  2. jsp项目放入宝塔windows环境_《鸡站群组》-教你建站(1.1) 下载并配置windows宝塔面板...
  3. STL-红黑树源码实现
  4. POSIX线程的同步
  5. apmserv mysql密码_apmserv中修改mysql的root与phpmyadmin密码方法介绍_PHP教程
  6. 背景图片随着浏览器拖动而变化
  7. catkin_make与gtest出现冲突的问题与解决
  8. linux驱动(七)gpiolib库详解
  9. Andriod SDK Manager国内无法更新的解决方案
  10. python学习——把计算GC含量的代码封装成函数