使用jQuery来创建Silverlight

2018-03-01 18:38:15 浏览数 (1)

使用jQuery来创建Silverlight

jQuery已经成为了VS2010内置支持的JavaScript脚本框架了,小巧实用。这里看看怎么用jQuery来在页面中创建一个Silverlight。( 呵呵,有一种swfobject的感觉了 )

jquery.silverlight.js

jQuery.fn.extend({     silverlight: function(opts) {         _opts = jQuery.extend({             background: 'white',             minRuntimeVersion: '2.0.31005.0',             autoUpgrade: true,             windowless: false,             width: '100%',             height: '100%'         }, opts);         if (!_opts.source || _opts.source == '') throw new error('「source」属性不能为空 ');         var obj = $('<object>').attr({             data: 'data:application/x-silverlight-2,',             type: 'application/x-silverlight-2',             width: _opts.width,             height: _opts.height         });         jQuery.each(_opts, function(name, value) {             if (name == 'width' || name == 'height') return;             obj.append(                 $('<param>').attr({                     name: name,                     value: value                 })             );         });         obj.append(             $('<a>').attr('href', 'http://go.microsoft.com/fwlink/?LinkID=124807').css('text-decoration', 'none').append(                 $("<img>").attr({                     src: 'http://go.microsoft.com/fwlink/?LinkId=108181',                     alt: '立刻安装 Microsoft Silverlight'                 }).css('border-style', 'none')             )         );         $(this).append(obj);     } });

使用方法

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" > <head>     <title>jQuery with Silverlight</title>     <script type="text/javascript" src="jquery-1.3.1.min.js"></script>     <script type="text/javascript" src="jquery.silverlight.js"></script>        <script type="text/javascript">            $(document).ready(function() {             $("#silverlightControlHost").silverlight({                 source: 'SilverlightApplication.xap'             });         });     </script>        <style type="text/css">     html, body {         height: 100%;         overflow: auto;     }     body {         padding: 0;         margin: 0;     }     #silverlightControlHost {         height: 100%;     }     </style>   </head> <body>     <div id="silverlightControlHost">     </div> </body> </html>

相关网址

http://jquery.com/

0 人点赞