$(function () {var isMouseDown = false;var currentTh = null; $('table th').bind({ mousedown:function (e) { var $th = $(this); var left = $th.offset().left; //元素距左 var rightPos = left + $th.outerWidth(); if (rightPos-4<= e.pageX && e.pageX <= rightPos) { isMouseDown = true; currentTh = $th; $('table th').css('cursor','e-resize'); //創(chuàng)建遮罩層,防止mouseup事件被其它元素阻止冒泡,導(dǎo)致mouseup事件無法被body捕獲,導(dǎo)致拖動(dòng)不能停止 var bodyWidth = $('body').width(); var bodyHeight = $('body').height(); $('body').append('<div id="mask" style="opacity:0;top:0px;left:0px;cursor:e-resize;background-color:green;position:absolute;z-index:9999;width:'+bodyWidth+'px;height:'+bodyHeight+'px;"></div>'); } } }); $('body').bind({ mousemove:function(e) { //移動(dòng)到column右邊緣提示 $('table th').each(function (index,eleDom) { var ele = $(eleDom); var left = ele.offset().left; //元素距左 var rightPos = left + ele.outerWidth(); if (rightPos-4<= e.pageX && e.pageX <= rightPos) { //移到列右邊緣 ele.css('cursor','e-resize'); }else{ if(!isMouseDown){ //不是鼠標(biāo)按下的時(shí)候取消特殊鼠標(biāo)樣式 ele.css("cursor","auto"); } } }); //改變大小 if(currentTh != null){ if(isMouseDown){ //鼠標(biāo)按下了,開始移動(dòng) var left = currentTh.offset().left; var paddingBorderLen = currentTh.outerWidth()-currentTh.width(); currentTh.width((e.pageX-left-paddingBorderLen)+'px'); } } }, mouseup:function (e) { isMouseDown = false; currentTh = null; $('table th').css('cursor','auto'); $('#mask').remove(); } }); });
本插件可能要修改的地方
1.遮罩層的id,mask可能和你的某些元素沖突,建議換成其它的
2.遮罩層的z-index可能不夠大,當(dāng)你拖動(dòng)停不下來的時(shí)候,把z-index提高,最大值為2147483647
聲明:本網(wǎng)頁內(nèi)容旨在傳播知識(shí),若有侵權(quán)等問題請(qǐng)及時(shí)與本網(wǎng)聯(lián)系,我們將在第一時(shí)間刪除處理。TEL:177 7030 7066 E-MAIL:11247931@qq.com