$(function(){ //移动窗口,并置顶窗口 [显示红框] $(".myMoveItem .moveItem_title").bind("mousedown", function(e1){ var _this = $(this).parents(".myMoveItem"); var oldpageX = e1.pageX; var oldpageY = e1.pageY; var oldLeft = parseInt(_this.css("left")); var oldTop = parseInt(_this.css("top")); var _clone = _this.clone().empty().css({ "border": "1px solid red", "background": "transparent", }).appendTo(_this.parent()); setMoveItemToppest(_clone); //置顶 $(document).bind("mousemove.myMoveItem", function(e2){ _clone.css("left", e2.pageX - oldpageX + oldLeft + "px"); _clone.css("top", e2.pageY - oldpageY + oldTop + "px"); }); $(document).bind("mouseup.myMoveItem", function(e2){ setMoveItemToppest(_this); //置顶 _this.css("left", parseInt(_clone.css("left"))); _this.css("top", parseInt(_clone.css("top"))); _clone.remove(); $(document).unbind("mousemove.myMoveItem"); $(document).unbind("mouseup.myMoveItem"); }); }); //移动窗口,并置顶窗口 [不显示红框,直接移动] [使用方法:取消这个注释,然后注释上面那个] // $(".myMoveItem .moveItem_title").bind("mousedown", function(e1){ // var _this = $(this).parents(".myMoveItem"); // var oldpageX = e1.pageX; // var oldpageY = e1.pageY; // var oldLeft = parseInt(_this.css("left")); // var oldTop = parseInt(_this.css("top")); // setMoveItemToppest(_this); //置顶 // $(document).bind("mousemove.myMoveItem", function(e2){ // _this.css("left", e2.pageX - oldpageX + oldLeft + "px"); // _this.css("top", e2.pageY - oldpageY + oldTop + "px"); // }); // $(document).bind("mouseup.myMoveItem", function(e2){ // $(document).unbind("mousemove.myMoveItem"); // $(document).unbind("mouseup.myMoveItem"); // }); // }); //点击时置顶 $(".myMoveItem").bind("click", function(){ setMoveItemToppest($(this)); }); //置顶窗口方法 function setMoveItemToppest(_this){ function sortNumber(a, b) {return a-b;} var zIndexArr = []; $(document).find(".myMoveItem").each(function(){ zIndexArr.push(parseInt($(this).css("z-index"))); }); zIndexArr.sort(sortNumber); _this.css("z-index", zIndexArr[zIndexArr.length-1] + 1); } //右下角改变窗口大小 $(".myMoveItem .moveItem_resize").bind("mousedown", function(e1){ var _this = $(this).parents(".myMoveItem"); var oldpageX = e1.pageX; var oldpageY = e1.pageY; var oldWidth = parseInt(_this.css("width")); var oldHeight = parseInt(_this.css("height")); $(document).bind("mousemove.myMoveItem", function(e2){ if((e2.pageX - oldpageX + oldWidth) > 150 && (e2.pageY - oldpageY + oldHeight) > 150){ _this.css("width", e2.pageX - oldpageX + oldWidth + "px"); _this.css("height", e2.pageY - oldpageY + oldHeight + "px"); // _this.children(".moveItem_body").css("height", "calc(100% - 95px)"); } }); $(document).bind("mouseup.myMoveItem", function(e2){ $(document).unbind("mousemove.myMoveItem"); $(document).unbind("mouseup.myMoveItem"); }); }); //关闭按钮 $(".myMoveItem .moveItem_close").click(function(){ $(this).parents(".moveItem_header").parent().hide(); }); //取消按钮 $(".myMoveItem .moveItem_cancel").click(function(){ $(this).parents(".moveItem_footer").parent().remove(); }); //全屏按钮 $(".moveItem_fullScreen").click(function(e){ $(this).hide(); $(this).siblings(".moveItem_normalScreen").attr("css-data", $(this).parents(".moveItem_header").parent().attr("style")); $(this).parents(".moveItem_header").parent().css({ "left":"0", "top":"0", "height":"100%", "width":"100%", }); // $(this).parents(".myMoveItem").children(".moveItem_body").css("height", "calc(100% - 95px)"); $(this).siblings(".moveItem_normalScreen").show(); }); //还原按钮 $(".moveItem_normalScreen").click(function(){ $(this).parents(".moveItem_header").parent().attr("style", $(this).attr("css-data")); $(this).hide(); $(this).siblings(".moveItem_fullScreen").show(); }); });