js 点击 隐藏弹出层

document.onmousedown = function(e){

  var ev = document.all ? window.event : e;

  var _con = $("#cicon"); // 设置目标区域

  if(!_con.is(e.target) && _con.has(e.target).length === 0){ // Mark 1

    if(!$("#cicon").is(":hidden")){

      $("#cicon").toggle();

    }

  }

}

时间: 2024-10-27 13:40:27

js 点击 隐藏弹出层的相关文章

js的事件冒泡和点击其他区域隐藏弹出层

一.前言 在编写页面的时候,我们经常使用到弹出层.对于弹出层,原本的意义就是增加与用户的交互,提升用户的好感度.如果弹出层都没有较好的体验,那何谈通过交互来提升好感... 首先提出几个弹出层的注意点: 弹出层的界面需要统一,不一致的弹出层并不能增加美感,相反还会显得页面布局更加杂乱无章: 弹出层的设计一定要好看,按钮要符合项目的主色调: 弹出层的宽度固定屏幕占比,设置max-width,高度根据内容自适应: 点击其他区域隐藏弹出层... 二.正文 今天,主要说说点击其他区域隐藏弹出层.笔者被这个

jquery实现点击按钮弹出层和点击空白处隐藏层

昨天做项目遇到一个问题,和大家分享下,jquery实现点击按钮弹出层和点击空白处隐藏层的问题 if($('.autoBtn').length){                $('.autoBtn').find('.assess').unbind().bind('click',function(event){                    //取消事件冒泡                      event.stopPropagation(); if($('.abtnBox').is

Js浮动层插件,点击按钮弹出层,可关闭

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>石家庄礼品公司</title>

点击弹出层以外的区域隐藏弹出层

我们店显示弹出层后,想让其消失,但又不想添加“X”来关闭,可以使用点击弹出层以外的区域来让该层消失的办法.下面如代码: $(".btn3").click(function(e){ e.stopPropagation();//阻止事件向上冒泡 $(".con-share").removeClass("hide"); }) //显示弹出层 $(document).click(function(e){ if(!$(".con-share&qu

react 点击空白处隐藏弹出层

点击空白处隐藏弹出层的原理是:在 document 上绑定事件来隐藏弹出层,这样点击任何元素的时候都会冒泡到 document 上,都会执行隐藏弹出层的功能.然后我们在不需要隐藏弹出层的元素上阻止冒泡即可. class Select extends Component { constructor(props) { super(props); this.state = { selected: props.list[0], showList: false }; this.showList = thi

js制作带有遮罩弹出层实现登录小窗口

要实现的效果如下 点击“登录”按钮后,弹出登录小窗口,并且有遮罩层(这个名词还是百度知道的,以前只知道效果,却不知道名字) 在没有点击“登录”按钮之前登录小窗口不显示,点击“登录”按钮后小窗口显示,并且遮罩层笼罩整个页面,使整个页面的其他元素暂时失去行为. 遮罩层的实现:相对于body绝对定位,宽度和高度都和body相同,并且有一定的透明度,使得下面的元素能够被看到.原先的元素的z-index为0,遮罩层的z-index在弹出登录小窗口和原先元素的之间. 说的不是很清楚,还是看代码吧! <!DO

点击页面其他区域隐藏弹出层

弹出层简称pop,隐藏方法有两种. 1. pop上阻止冒泡,document上click隐藏pop jquery实现 $("#showPop").on("click", function(e) { $("#pop").show(); $(document).one("click", function() { $("#pop").hide(); }); e.stopPropagation(); }); $(&

Js实例——模态框弹出层

1.描述 百度登录就是一个模态框弹出层.思路分析:先将灰色大背景和登陆盒子设为不可见,利用JS将其动态加载可见. 2.代码 <!DOCTYPE html> <html> <head> <title>模态框弹出层.html</title> <meta http-equiv="keywords" content="keyword1,keyword2,keyword3"> <meta http-

前端学习代码实例-JavaScript点击按钮弹出层效果

强大的效果其实都是由一个个简单的功能组合而成的,下面介绍一下如何实现点击一个按钮弹出一个层的效果. 代码实例如下: <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name="author" content="http://www.softwhy.com/" /> <title>web前端开发学习q群:73