js 給div 添加選區，類似windows案頭選區一樣，相容ie6、7、8、9、10、Firefox、Google、所有瀏覽器

先來一張：

相容：

IE6 反應有點遲鈍，效果沒有Firefox好。

主要的效果就是，模仿windows案頭的那個選區。可以用選框選區表徵圖。

由於js代碼太多，只貼一段核心的代碼。

js核心代碼:

//選區function select(){//為工作區建立一個選區var _down=false;var pos={x:0,y:0};var move={x:0,y:0};$(".working").mousedown(function(event) {//如果是右鍵if(event.button==2)return;//不是點擊的案頭 返回if(!$(event.target).is(".icons"))return;_down=true;pos.x=event.clientX;pos.y=event.clientY;$(".select").css("left",pos.x);$(".select").css("top",pos.y);$(".select").show();});$(".working").mousemove(function(event) {if(!_down)return;move.x=event.clientX;move.y=event.clientY;//減去2 相容ievar width=move.x-pos.x-2;var height=move.y-pos.y-2;var select=$(".select");//選區向左if(width>=0&&height>=0){select.css("width",width);select.css("height",height);}else{//選區向右延伸if(width<0){//求絕對值var w=Math.abs(width);select.css("width",w);select.css("left",move.x);if(height>=0){select.css("height",height);}}if (height<=0) {var h=Math.abs(height);select.css("height",h);select.css("top",move.y);if(width>=0){select.css("width",width);}}}});$(".working").mouseup(function() {_down=false;$(".select").css("width",0);$(".select").css("height",0);$(".select").hide();});}

上面的效果當然還需要配合css 來做。完整的Dome過一段時間發。