Silverlightコンテンツを埋め込むｊQueryプラグイン

Silverlight JavaScript

欲しかったので作ってみた。

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);
    }
});

使い方

silverlightメソッドを呼び出すだけ。引数はマップでsourceやwidth、heightなんかを指定できる。

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="jQuerySilverlightPlugin._Default" %>

<!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 runat="server">
    <title></title>
    <script type="text/javascript" src="Scripts/jquery-1.2.6.pack.js"></script>
    <script type="text/javascript" src="Scripts/jquery.silverlight.js"></script>
    <script type="text/javascript">
        $(function() {
            $("#slhost").silverlight({
                source: 'ClientBin/Sample.xap'
            });
        });
    </script>
</head>
<body>
    <form id="form1" runat="server">

    <div id="slhost" style="height: 200px;">
    </div>

    </form>
</body>
</html>

これでSilverlightコンテンツを簡単に埋め込める。でも何故かIEでは動かない。誰か動くようにしてけれ！

ソース