【web布局】记录一个很搞笑的bug

最新推荐文章于 2022-09-06 21:25:42 发布

原创最新推荐文章于 2022-09-06 21:25:42 发布 · 472 阅读

0 ·

CC 4.0 BY-SA版权

本文描述了一个关于网页中使用fixed定位元素导致点击事件失效的问题。作者最初遇到此问题时十分困惑，因为控制台既没有错误也没有任何输出。最终发现是因为页面滚动导致原本覆盖在按钮上的元素发生了偏移，进而使得点击事件可以正常触发。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

起初以为自己遇到一个很诡异的问题，

如图，加号和减号事件怎么点怎么无反应，控制台不报错也不报异常

检查绑定事件的代码，未发现问题

将click事件改成打印log，控制台居然还是无任何输出

思考数秒未果...

偶然将页面滑动

点击按钮时突然响应

恍然大悟...

哈哈哈

遂默默将两个fixed定位的模块分离...

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

刺猬学会了

关注关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
分享

复制链接

分享到 QQ

分享到新浪微博

扫一扫
举报

举报

Unity开发bug记录100例子（第2例）——UI移动重影问题

爱上游戏开发

07-04

2135

完美简单解决unity重影问题

经典Web安全缺陷 Web Security Bug

Liuhaiyan6的博客

09-12

1310

Web安全方面的缺陷，是需要自己动手操作，然后做一些基本的分析。下面我先从SQL注入风险方面进行操作。 Bug：testfire网站有SQL注入风险缺陷标题：testfire网站>登录页面>登录框有SQL注入攻击问题。 1、SQL注入式攻击：就是攻击者把SQL命令插入到Web表单的输入域或页面请求的查询字符串，欺骗服务器执行恶意的SQL命令。 SQL注入是正常的WWW端口访问，而且表面

参与评论您还未登录，请先登录后发表或查看评论

高效前端：WEB搞笑编程与优化

07-19

高效前端：WEB搞笑编程与优化高效前端：WEB搞笑编程与优化高效前端：WEB搞笑编程与优化高效前端：WEB搞笑编程与优化高效前端：WEB搞笑编程与优化高效前端：WEB搞笑编程与优化

页面布局中的bug

qq_34650969的博客

08-30

401

综述：虽然说被停止支持，但是不得不说的是，IE6的市场并不会随着支持的停止而立刻消散下去，对于WEB前端开发工程师来说，兼容IE6 兼容各个浏览器，依然是不得不面对的工作。在此总结了常见的浏览器兼容问题，里面也有IE6的常见兼容问题，供大家分享。（只是页面布局的bug）

心形表白VBS和web页面恶搞跳转邮箱

06-17

一个心形的vbs小程序，外加一个web页面的恶搞，跳转邮箱的，如有需要页面跳转邮箱中的发邮件，可以参考下

web中两个经典bug

PiShubing的博客

02-15

414

问题一：margin塌陷问题：解决方法bfc（black format content） bfc可以说是专门用来解决margin塌陷问题 ![在这里插入图片描述](https://img-blog.csdnimg.cn/20200215164131681.png) a是b的父级块，当对a或b中写入margin-left；a会相对于文本框移动，而b相对于a这个父级块进行移动。但是当对于这种父...

Web前端中两个经典的bug以及bfc

m0_46201220的博客

04-24

247

margin-top塌陷什么是margin-top塌陷? <div class="wrapper"> <div class="box"></div> </div> <style> *{ margin: 0; padding: 0; ...

你在测试中发现了一个bug，但是开发经理认为这不是一个bug，应该怎样解决

m0_73421468的博客

09-06

2399

首先，将问题提交到缺陷管理库里面进行备案。合理的论述，向测试经理说明自己的判断的理由，注意客观、严谨，不参杂个人情绪。等待测试经理做出最终决定，如果仍然存在争议，可以通过公司政策所提供的渠道，向上级反映，并有上级做出决定。首先，查找需求说明、网站设计等相关文档，分析测试需求。制定测试计划，确定测试范围和测试策略，一般包括以下几个部分：功能性测试；界面测试；性能测试；数据库测试；安全性测试；兼容性测试一般从以下两个方面考虑：压力测试；负载测试；强度测试要具体决定是否需要开展。

27个WEB相关项目源码.rar

02-28

CSZ CMS：一个开源Web应用程序-开源

04-13

1. `CHANGELOG`：这是一个记录CSZ CMS版本更新和改进的日志文件，用户可以通过阅读它来了解新版本带来了哪些功能增强和修复的bug。 2. `nginx_example.com.conf`：这是针对Nginx服务器的配置示例文件，用于指导用户...

一个好的web开发人员需知道的10件事情.docx

09-26

【标题】: 一个好的Web开发人员需知道的10件事情【描述】: 文档列举了成为优秀Web开发人员必备的10项关键技能，包括正则表达式、基本SEO、JavaScript库、跨浏览器调试等，这些技能对于前端和全栈开发都至关重要。 ...

非常经典的ie bug汇总，页面之王的代表作

05-20

非常经典的ie bug汇总，页面之王的代表作

常见css BUG

04-20

常见css BUG

Web应用测试的典型Bug

初涉云端

12-10

1731

这是以前回答的另外一个关于BUG的帖子，也存下，或许自己以后用得着，地址（http://bbs.mianwww.com/viewthread.php?tid=227&extra=page%3D2）一、链接测试可能存在的问题：1、链接未按指示的那样确实链接到了该链接的页面； 2、所链接的页面不存在； 3、Web 应用系统上存在孤立的页面，即是没

30条爆笑的程序员梗PHP是最好的语言

热门推荐

Websites

05-27

1万+

1.问答 Q：你是怎么区分一个内向的程序员和一个外向的程序员的? A：外向的程序员会看着你的鞋和你说话时。 Q：为什么程序员不能区分万圣节和圣诞节? A：这是因为 Oct 31 == Dec 25!(八进制的 31==十进制的 25) 2.火车火车一个年轻的程序员和一个项目经理登上了一列在山里行驶的火车，他们发现列车上几乎都坐满了，只有两个在一起的空位，这个空位的对面是一...

7-HTML+CSS页面布局重点总结

Bug_money的博客

01-10

697

HTML 重点： 1）每种标签特性 h1 table tbody tr td ul,ol,dl li,dt,dd p a

前端调试必备技巧（控制台使用完全指南）

java、c++、机器学习方向King

06-27

1万+

http://www.w3cplus.com/tools/chrome-devtools-console.html?utm_source=tuicool&utm_medium=referral 了解如何：打开 DevTools 控制台；堆叠冗余消息或将其显示在各自的行上；清除或保留输出，或者将其保存到文件中；过滤输出，以及访问其他控制台设置。打开控制台以全屏模式的专用面板

一个点击率10万+的恶搞程序送给大家！

qq_34095850的博客

07-29

1936

最近，小编制作了一个恶搞程序回馈给大家话不多说下面，小编就为大家讲讲这个恶搞程序怎么玩 ▼ ↓↓↓恶搞程序玩法↓↓↓ 第一步关注微信公众号笑话星球后台发送关键词“恶搞”获取最新链接打开链接后如下图所示↓↓↓ 第二步切换你想要的图片修改标题和描述，点击底部确定要恶搞好友，生成恶搞二维码↓↓↓ 第三步复制生成的二维码...

前端两个经典bug

u011280778的博客

06-29

1106

1、margin塌陷bug <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta...

如何创建一个简单的泡泡龙游戏

由于压缩包子文件列表中包含了一个URL地址和.js结尾的文件，我们可以推测这个游戏可能是基于Web平台开发的，使用了HTML5和JavaScript。 1. **HTML5 canvas元素**：用于在网页上绘制图形和动画，是实现泡泡龙游戏中...