jquery ui Dialog 添加最大最小化按钮控制

<script> xDialog ////////////////////////////////////////////////////////////////// // 扩展 jquery dialog 最大最小按钮后，界定其作用范围。 // 根据 close 按钮格式，在jquery ui css 里面修改，得到 max mix 按钮。 // function mm(title,data){ var rg=/'/g; var dialog = $("<div title='"+ title.replace(rg,' ') +"'><p>"+ data +"</p></div>"); dialog.dialog({ autoOpen: false, show: "blind", hide: "blind",// explode width:530, height:410, close:function(event, ui) {$(this).dialog( "destroy" ).remove();},//$(this).dialog( "destroy" ).remove();alert('s'); open: function (event, ui) { var $dialog = $(this);//alert($dialog.html()); $('.ui-dialog-title', $dialog.parent()).css('width','70%'); // 界定选取范围，重点。 var atext = $(".ui-dialog-titlebar-close", $dialog.parent()).before('<a href="#" class="ui-dialog-titlebar-min ui-corner-all" role="button"><span class="ui-icon ui-icon-minusthick">minusthick</span></a><a href="#" class="ui-dialog-titlebar-max ui-corner-all" role="button"><span class="ui-icon ui-icon-extlink">extlink</span></a>'); $(".ui-dialog-titlebar .ui-icon", $dialog.parent()).click(function () { var spantext = $(this).text(); //alert("ok:ui-span" + spantext); if (spantext == "extlink") { if (window.screen) { //判断浏览器是否支持window.screen判断浏览器是否支持screen var myw = screen.availWidth; //定义一个myw，接受到当前全屏的宽 var myh = screen.availHeight; //定义一个myw，接受到当前全屏的高 //window.moveTo(0, 0); //把window放在左上脚 //window.resizeTo(myw, myh); //把当前窗体的长宽跳转为myw和myh $dialog.dialog({ position: ['left', 'top'], width: myw * 0.6, height: myh * 0.6 }); } else { $dialog.dialog({ position: 'center', width: 640, height: 480 }); } } else if (spantext == "minusthick") { $dialog.dialog({ position: 'top', width: 590, height: 50 }); }else if (spantext == "close") { // alert('s'); }else { alert("请选择正确的图标,谢谢."); } }); } }); dialog.dialog("open"); return false; } </script> <style type="text/css"> p.ui-xlgwr .ui-icon{ position:relative; float: left; margin:0.4em 0.3em 0 0.5em; cursor: pointer; z-index:999;} p.ui-xlgwr{ position:absolute; top:-10px; padding:0; right:1.2em; display:inline;} </style> <script> xDialog ////////////////////////////////////////////////////////////////// // 扩展 jquery dialog 最大最小按钮后，界定其作用范围。独立css，替换 // ui css 关闭按钮。使用上面css。 // function mm(title,data){ var rg=/'/g; var dialog = $("<div title='"+ title.replace(rg,' ') +"'><p>"+ data +"</p></div>"); dialog.dialog({ autoOpen: false, show: "blind", hide: "blind",// explode width:530, height:410, close:function(event, ui) {$(this).dialog( "destroy" ).remove();},//$(this).dialog( "destroy" ).remove();alert('s'); open: function (event, ui) { var $dialog = $(this);//alert($dialog.html()); $('.ui-dialog-title', $dialog.parent()).css('width','70%'); // 界定选取范围，重点。 var atext = $(".ui-dialog-titlebar-close", $dialog.parent()).before('<a href="#" class="ui-dialog-titlebar-min ui-corner-all" role="button"><span class="ui-icon ui-icon-minusthick">minusthick</span></a><a href="#" class="ui-dialog-titlebar-max ui-corner-all" role="button"><span class="ui-icon ui-icon-extlink">extlink</span></a>'); $(".ui-dialog-titlebar .ui-icon", $dialog.parent()).click(function () { var spantext = $(this).text(); //alert("ok:ui-span" + spantext); if (spantext == "extlink") { if (window.screen) { //判断浏览器是否支持window.screen判断浏览器是否支持screen var myw = screen.availWidth; //定义一个myw，接受到当前全屏的宽 var myh = screen.availHeight; //定义一个myw，接受到当前全屏的高 //window.moveTo(0, 0); //把window放在左上脚 //window.resizeTo(myw, myh); //把当前窗体的长宽跳转为myw和myh $dialog.dialog({ position: ['left', 'top'], width: myw * 0.6, height: myh * 0.6 }); } else { $dialog.dialog({ position: 'center', width: 640, height: 480 }); } } else if (spantext == "minusthick") { $dialog.dialog({ position: 'top', width: 590, height: 50 }); }else if (spantext == "close") { // alert('s'); }else { alert("请选择正确的图标,谢谢."); } }); } }); dialog.dialog("open"); return false; } </script>