码迷,mamicode.com
首页 > 其他好文 > 详细

div遮罩实现禁用鼠标(click、hover等)事件

时间:2017-03-18 01:02:15      阅读:638      评论:0      收藏:0      [点我收藏+]

标签:move   自己   wrap   nbsp   部分   dex   parent   opacity   框架   

     这两天在帮老师做网页,今天想实现在一块区域内禁止鼠标的各种事件,本来是想在框架模板的js文件里去修改,但是改代码的时候有点凌乱。。。感觉应该自己把问题想复杂了。

     所以想了想要是能实现在一个区域内(如:div)遮罩住区域下方的操作,强大的某度让我很快找到了答案,拿去一试,诶~还挺方便,一试就灵。

     所以在此处贴下相应代码仅供参考:

   1、Javascript 部分代码

 1  function MaskIt(obj){
 2    var hoverdiv = ‘<div class="divMask" style="position: absolute; width: 100%; height: 100%; left: 0px; top: 0px; background: #fff; opacity: 0; filter: alpha(opacity=0);z-index:5;"></div>‘;
 3    $(obj).wrap(‘<div class="position:relative;"></div>‘);
 4    $(obj).before(hoverdiv);
 5    $(obj).data("mask",true);
 6   }
 7  function UnMaskIt(obj){
 8    if($(obj).data("mask")==true){
 9      $(obj).parent().find(".divMask").remove();
10      $(obj).unwrap();
11      $(obj).data("mask",false);
12      }
13      $(obj).data("mask",false);
14  }

    2、调用方法

         比如:我在html中有一个div的 id 是“needMask” 

1 <div id="needMask">
2     ……
3 <div>

       
        调用时,就是用函数:

1 MaskIt($(‘#needMask‘));

     
      恩......end  希望能帮到有需要的盆友:)

    

         

 

  
      

div遮罩实现禁用鼠标(click、hover等)事件

标签:move   自己   wrap   nbsp   部分   dex   parent   opacity   框架   

原文地址:http://www.cnblogs.com/sunnywss/p/6569125.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!