简单记录个a标签点不上的bug

官网改版时碰到的问题。简单记录下:

【 问题 】

官网index页面移动端测试时,发现底部页脚的a标签无论如何点不动。

【 Debug 过程 】

1、先是在pc端用浏览器模拟手机看了下,问题重现;

2、然后看了下“规则”和“计算后”面板(用的是FireFox,习惯了……分别对应Chrome的styles和computed),a标签本身的样式似乎是没问题的,周围也没啥问题……

3、丢到chrome里,问题依然重现,继续懵逼……

4、无意间关掉了移动端模拟,居然好了卧槽!!!(黑人问号脸.gif)继续懵逼……

5、试着用“选择元素”工具去点选a标签,居然点到了上边一个透明的空标签上(有宽高),试了几次都是如此(嗯?),然后检查发现该标签position: fixed;,移动端页面收缩后挤下来、整好遮挡住了a标签……至此找到原因。

6、因为该标签不需要响应点击事件,所以直接加了句pointer-events:none,问题解决。

【 小结 】

  • 其实最开始应该先试下z-index的(个人有点排斥这个样式,都是自然写法),失策失策~~
  • 不要随便写fixed的透明标签……血泪教训=_=|||……
  • 无比怀念FireFox的3D模式……然并卵。以后只好用“选择元素”排除类似的bug了。
  • pointer-events:none真的是神器,省了很多js(其实是jq)“事件监听+选择器判断/过滤”的事。

原文地址:https://www.cnblogs.com/jlfw/p/12565505.html

时间: 2024-09-29 16:26:49

简单记录个a标签点不上的bug的相关文章

简单记录一次REDO文件损坏报错 ORA-00333重做日志读取块出错

一.故障描述 首先是实例恢复需要用到的REDO文件损坏 二.解决方法 1.对于非当前REDO或者当前REDO但是无活动事务使用以下CLEAR命令: 用CLEAR命令重建该日志文件SQL>alter database clear logfile group 3: 如果是该日志组还没有归档,则需要用SQL>alter database clear unarchived logfile group 3: 因为是当前实例恢复需要用的REDO,且未归档,使用是CLEAR命令不行的. 2.没备份,有备份可

简单记录一次ORA-00600: internal error code, arguments: [2662]

接上一个,REDO报错搞定后OPEN数据库时又报错ORA-00600: internal error code, arguments: [2662]. 原因是_ALLOW_RESETLOGS_CORRUPTION后resetlogs打开数据库,我们可能会由于SCN不一致而遭遇到ORA-00600 2662号错误,这里给出一个完整的例子及解决过程. 现象及解决--这个没拍照参考EYGLE的吧 Sun Dec 11 18:02:25 2005 Errors in file /opt/oracle/a

简单记录一次ORA-00600: internal error code, arguments: [4194]

接上一篇,在搞定SCN问题后,又遇到ORA-600[4194]/[4193]报错. 故障现象: OPEN数据库时报错:ORA-00600: internal error code, arguments: [4194], [], [], [], [], [], [], [] 4193:表示undo和redo不一致(Arg [a] Undo record seq number,Arg [b] Redo record seq number ): 4194:表示也是undo和redo不一致(Arg [a

一个简单的jsp自定义标签

学到了一个简单的jsp自定义标签,后面有更多的例子,会更新出来: 例子1: 步骤: 1.编写标签实现类: 继承javax.servlet.jsp.tagext.SimpleTagSupport; 重写doTag,实现在网页上输出: 2.在web-inf目录或其子目录下,建立helloword.tld文件,即自定义标签的说明文件 注意:标签处理类必须放在包中,不能是裸体类:不需要修改web.xml: //tld: tag lib description 标签库描述 java代码: package

u-boot命令行调试LCD简单记录

一般来说,调试uboot最好的方式是使用openjtag,因为uboot说到底就是一段裸机程序,只不过比较复杂.但是受实际环境限制,实际工作中使用较多的调试技巧主要有两种:打印和直接在命令行测试,打印比较常见也比较简单,直接使用printf即可,这里就以最近这段时间调试uboot下面lcd为例,简单说说命令行调试. 平台: am335x,u-boot 2010.09,linux 3.10 问题: 由于此版本u-boot比较旧,没有整套framebuffer子系统框架,所以采取的是移植好官方裸机驱

iOS简单易用的标签列表界面

iOS简单易用的标签列表界面 Demo效果: Demo演示: 1.使用cocoapods引入YZTagListView,或者直接拖入YZTagListView文件夹到项目中 2.导入YZTagListView.h头文件 1 #import "YZTagList.h" 3.创建YZTagListView控件 1 2 3   YZTagList *tagList = [[YZTagList alloc] init];   tagList.backgroundColor = [UIColor

简单记录一次ORA-00600 kcratr_nab_less_than_odr

当前详细报错已经没有了,只有相应图.参考EYGLE一篇文章中数据: 1.故障现象 数据库版本11G,错误类似以下: ORA-00600: 内部错误代码, 参数: [kcratr_nab_less_than_odr]错误,具体的错误信息类似: Incident 63078 created, dump file: /u01/diag/rdbms/orcl/orcl/incident/incdir_63078/orcl_ora_1916_i63078.trc ORA-00600: 内部错误代码, 参数

[Ruby on Rails系列]6、一个简单的暗语生成器与解释器(上)

[0]Ruby on Rails 系列回顾 [Ruby on Rails系列]1.开发环境准备:Vmware和Linux的安装 [Ruby on Rails系列]2.开发环境准备:Ruby on Rails开发环境配置 [Ruby on Rails系列]3.初试Rails:使用Rails开发第一个Web程序 [Ruby on Rails系列]4.专题:Rails应用的国际化[i18n] [Ruby on Rails系列]5.专题:Talk About SaSS [1]任务目标 本次主要是要实现一

openstack手动部署简单记录

1,关于网络规划部分,之前写的都好好的了,浏览器TM的崩溃了,我写几天的笔记 记录全给我丢了,我TM的多心疼啊! 大致说了关于openstack手动安装关于网络规划的问题 第一种legacy networking architecture  design :controller(跑单网卡management) + N computerNodes(跑2块网management+虚机实例隧道口卡) 第二种 openstack networking (neutron) architecture des