jquery ui弹出YouTube视频模块

Ian*_*ink 1 youtube jquery-ui modal-dialog

有没有办法使用jQueryUI以模态方式弹出YouTube视频?

这是我的YouTube代码:

<object width="480" height="385"><param name="movie" value="http://www.youtube.com/v/DIuXtsaUDmM?fs=1&amp;hl=en_US"></param><param name="allowFullScreen" value="true"></param><param name="allowscriptaccess" value="always"></param><embed src="http://www.youtube.com/v/DIuXtsaUDmM?fs=1&amp;hl=en_US" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="480" height="385"></embed></object>
Run Code Online (Sandbox Code Playgroud)

sca*_*tag 6

您可以尝试修改以下代码以适应您的方案..我已经使用了您的视频链接.您还必须下载jquery文件.

<html>
<head>
<title> Youtube Popup</title>
<link type="text/css" href="jquery-ui-1.8.7.custom.css" rel="stylesheet" />
<script language="javascript" src="jquery-1.4.4.min.js"></script>
<script language="javascript" src="jquery-ui-1.8.7.custom.min.js"></script>


<script>
    function Show() {

        $( "#dialog:ui-dialog" ).dialog( "destroy" );

        $( "#dialog-modal" ).dialog({
            height: 470,
                        width: 550,
            modal: true
        });
    }
    </script>

</head>

<body>

<div id="dialog-modal" Title="Youtube Video" style="display:none">

<object width="480" height="385"><param name="movie" value="http://www.youtube.com/v/DIuXtsaUDmM?

fs=1&amp;hl=en_US"></param><param name="allowFullScreen" value="true"></param><param name="allowscriptaccess" 

value="always"></param><embed src="http://www.youtube.com/v/DIuXtsaUDmM?fs=1&amp;hl=en_US" type="application/x-

shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="480" height="385"></embed></object>

</div>

<input type="button" onclick="javascript:Show()" value="click me" />

</body>

</html>
Run Code Online (Sandbox Code Playgroud)

希望这可以帮助