如果为某个元素样式设置了“pointer-events: none ”，事件、连接、悬浮样式都没有了

如果为a标签设置了“pointer-events: none ”，点击a标签，不会跳转到链接地址，而且也没有悬浮样式，但是通过tab键可以选中连接进行跳转，可以把href去掉，这样就不能选中了

我写了一个div（X）和一个超链接（链接百度），我通过定位把他们放到了同一个地方，div在上，超链接在下，现在点击超链接是没有反应的，因为上面还有层div，超链接被遮挡住了

，如果为div设置了“pointer-events: none ”，再点击超链接，页面就进行跳转了，相当于div只是一个虚设的东西，如同海市蜃楼，任何事件都可以轻易从它身上穿过去！

pointer-events: none的更多相关文章

  1. 浏览器 Pointer Events

    前言 Pointer Events是一套触控输入处理规格,支持Pointer Events的浏览器包括了IE和Firefox,最近Chrome也宣布即将支持该处理规则. PointerEvent Po ...

  2. javascript code snippet -- Forwarding Mouse Events Through Layers

    Anyone who has worked with web apps has likely created a masking element at some point, and the grea ...

  3. ExtJS笔记 Using Events

    Using Events The Components and Classes of Ext JS fire a broad range of events at various points in ...

  4. touch pointer

    在早期的浏览器,输入的事件其实相对单纯,只有考虑到鼠标和键盘两种:而当时的鼠标事件,其实就是 click.mousedown.mouseup 等等的事件.但是当手机.平板开始流行时候,再移动装置上的主 ...

  5. 浏览器的统一指针事件：Pointer Event

    在早期的浏览器,输入的事件其实相对单纯,只有考虑到鼠标和键盘两种:而当时的鼠标事件,其实就是 click.mousedown.mouseup 等等的事件.但是当手机.平板开始流行时候,再移动装置上的主 ...

  6. jquery触屏幻灯片

    一.前言 去年接触了移动Web开发,做了些手机端的网站及应用,还有些小的微信游戏和活动页面.每个项目里或多或少的都会有一些触屏事件等.其中有两个用到了jquery触屏幻灯片.刚开始的时候也在百度上搜索 ...

  7. javascript 手势缩放 旋转 拖动支持：hammer.js

    原文: https://cdn.rawgit.com/hammerjs/hammer.js/master/tests/manual/visual.html /*! Hammer.JS - v2.0.4 ...

  8. Xenko基础API笔记3- Pointers指针设备屏幕上点对应的手指触摸。

    样本这里是一个简单的示例程序,跟踪目前在屏幕上的指针和打印他们的位置.访问输入字段,类继承自@ SiliconStudio.Xenko.脚本的类. public override async Task ...

  9. 【转】谈谈Google Polymer以及Web UI框架的未来

    原文转自:http://www.csdn.net/article/2013-05-27/2815450-google-polymer 摘要:开发者Axel Rauschmayer在自己的博客上详解了G ...

  10. 单击HighCharts柱形体弹框显示详细信息

    上篇博客介绍了如何在HighCharts统计图表下生成表格,二者相互结合,可以对数据进行更好的统计分析.在统计的同时,如果需要想要及时查看详细信息的话,就得再加一个功能,就是单击柱形体,显示该项下的详 ...

随机推荐

  1. 剑指 offer 第一题： 二维数组中的查找

    打算写 图解剑指 offer 66 题 的系列文章,不知道大家有没有兴趣

  2. C#工具:MySQL忘记密码解决方法

    1.进入管理员控制台停止mysql服务:net stop mysql; 2.进入mysql的安装路径,如我的安装路径为C:\Program Files\MySQL\MySQL Server 5.5,打 ...

  3. c# 构造tree下拉框，空格转化

    c#代码写的空格如何在html中的select中展示出来呢? var str = ""; //父级菜单不缩进 ; j < i; j++) { str += HttpUtili ...

  4. 折腾Java设计模式之模板方法模式

    博客原文地址:折腾Java设计模式之模板方法模式 模板方法模式 Define the skeleton of an algorithm in an operation, deferring some ...

  5. 05 入门 - 浅谈 ASP.NET MVC程序的工作原理

    目录索引:<ASP.NET MVC 5 高级编程>学习笔记 本篇内容 1. Global.asax文件 2. RouteConfig.cs文件 3. 视图命名和寻址的规则 前面创建了一个简 ...

  6. vue实例化

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  7. 服务器三：多线程epoll

    #include <fcntl.h> #include <sys/socket.h> #include <netinet/in.h> #include <ar ...

  8. fullpage 全屏插件

     fullpage 全屏插件 全屏滚动效果,原生js也很好实现,主要是用 mousewheel 鼠标滚轮滚动事件, 来判断上滚动还是下滚动,之后设置每次滚动的高度为屏幕的高度即可.但是,虽然效果简单, ...

  9. maven+springMVC(二)

    [目录]

  10. ext组件的查询方式

    1.使用id进行查询 (1)Ext.ComponentQuery.query("#mypanel") (2)Ext.getCmp("mypanel") 2.根据 ...