如何最小化/最大化jQuery对话框? [英] How to Minimize/Maximize jQuery Dialog?

查看:85
本文介绍了如何最小化/最大化jQuery对话框?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我正在使用 jQuery UI Dialog 来显示视频。视频工作正常。

I am using jQuery UI Dialog to show a video. The video is working fine.

我想做的是最小化Dialog元素,就像在操作系统或类似的东西中一样。像( - )这样的小图标可以最小化我的对话框,当我按(*)它会关闭对话框但保持视频在后台运行。

What I want to do is minimize the Dialog-element just like in an OS or something like that. A small icon like (" - ") that would minimize my dialog and when I press (*) it would close the dialog but keep the video running in the background.

这是我的代码

//Watch Video

$(".watchVideo").live('click',function(){
    if($('div.ui-dialog').length){
        $('div.ui-dialog').remove();
    }

    var path  = $(this).attr('rel');
    var title = $(this).attr('title');

    var $dialog = $('<div>', {
        title: translator['Watch Video']
    }).dialog({
        autoOpen: false,
        modal: true,
        width: 600,
        height: 500
    });

    var tab = '<table  style="margin: 10px 10%;"><tr><td><object id="MediaPlayer1" width="500" height="400" classid="CLSID:22D6F312-B0F6-11D0-94AB-0080C74C7E95" codebase="http://activex.microsoft.com/activex/controls/mplayer/en/nsmp2inf.cab#Version=5,1,52,701" standby="Loading Microsoft® Windows® Media Player components..." type="application/x-oleobject" align="middle"><param name="'+title+'" value="'+path+'"> <param name="ShowStatusBar" value="True">  <param name="DefaultFrame" value="mainFrame"> <param name="autostart" value="false">  <embed type="application/x-mplayer2"  pluginspage = "http://www.microsoft.com/Windows/MediaPlayer/"  src="'+path+'"   autostart="false"  align="middle" width="500"    height="300"   defaultframe="rightFrame"  showstatusbar="true"> </embed></object></td></tr></table>';

    $('<div id="updateContent">').html(tab).appendTo($dialog);
    $dialog.dialog('open');
    return false;

});

其中var tab等于

where var tab is equal to

<object id="MediaPlayer1" width="500" height="400"
classid="CLSID:22D6F312-B0F6-11D0-94AB-0080C74C7E95"
codebase="http://activex.microsoft.com/activex/controls/mplayer/en/nsmp2inf.cab#Version=5,1,52,701"
standby="Loading Microsoft® Windows® Media Player components..."
type="application/x-oleobject" align="middle">
    <param name="FileName" value="YourFilesName.mpeg">
    <param name="ShowStatusBar" value="True">
    <param name="DefaultFrame" value="mainFrame">
    <param name="autostart" value="false">
    <embed type="application/x-mplayer2"
     pluginspage = "http://www.microsoft.com/Windows/MediaPlayer/"
     src="YourFilesName.mpeg"
     autostart="false"
     align="middle"
     width="500"
    height="300"
    defaultframe="rightFrame"
    showstatusbar="true">
 </embed>

推荐答案

jQuery UI对话框有一个扩展名,名为DialogExtend,允许您添加最大化,最小化和恢复按钮:

There is an extension for jQuery UI dialog, named "DialogExtend" that allows you to add a maximize, minimize and restore buttons:

  • Code: https://github.com/ROMB/jquery-dialogextend
  • Demo: http://jsbin.com/ehagoy/154

完美运作。

这篇关于如何最小化/最大化jQuery对话框?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆