移动端HTML5点击事件闪现灰色背景解决方案

最新推荐文章于 2022-03-18 18:10:07 发布
转载 最新推荐文章于 2022-03-18 18:10:07 发布 · 1w 阅读 · 4
文章标签：

#html5 #移动 #点击灰色背景

本文介绍如何通过CSS解决移动端网站及应用中常见的点击元素时出现的阴影或灰色背景问题，提供解决方案并确保用户体验。

隐藏文本框阴影

input, textarea{-webkit-appearance: @none;}

取消手机点击屏幕时，会出现的灰块

html,body{-webkit-text-size-adjust: 100%;-webkit-tap-highlight-color: rgba(0, 0, 0, 0);}

 　

移动端网站或APP点击后出现闪动或灰色背景

只需对绑定事件添加class样式 使其触发事件时背景为透明色  

.class{-webkit-tap-highlight-color:transparent;}
pyinstaller打包后闪现cmd黑色窗口解决方案
猿小白的博客
11-15 4319
在使用pyinstaller打包python GUI程序的时候，发现在执行os.system过程中，程序会出现闪现cmd命令黑窗口，如果不解决，用户体验感很差。下来说说该如何解决这个问题。 目录 一、首先导入subprocess依赖模块 二、定义run_cmd函数 三、替换掉原来的os.system命令 四、重新执行打包命令 五、简单小结 一、首先导入subprocess依赖模块 import subprocess 该方法主要利用subprocess模块中的call方法代替之前os..
cesium修改灰色背景（默认蓝色）（cesium篇.81）
地图之家
06-16 1349
地图之家总目录（订阅之前建议先查看该博客） 文章末尾处提供保证可运行完整代码包，运行如有问题，可“私信”博主。 效果如下所示： 下面献上完整代码，代码重要位置会做相应解释
移动端网站或APP点击后出现闪动或灰色背景
weixin_30279315的博客
08-14 428
隐藏文本框阴影 input, textarea{-webkit-appearance: @none;} 取消手机点击屏幕时，会出现的灰块 html,body{-webkit-text-size-adjust: 100%;-webkit-tap-highlight-color: rgba(0, 0, 0, 0);} 　 移动端网站或APP点击后出现闪动或灰色背景 只需对...
移动端点击组件有阴影
紫月7575的博客
10-28 452
移动端点击组件有阴影 ios的单选框点击之后,组件变蓝,但是有焦点的那个组件会有蓝色阴影,失去焦点阴影就会消失 解决方法 box-shadow:0 0 0 0!important; 我使用的是element-ui的组件,查看源代码之后,发现阴影是在span的el-radio__inner上的 代码 .el-radio__input.is-checked{ .el-radio__inner{ box-shadow:0 0 0 0!important;
移动端，点击之后某个区域后有阴影
weixin_30767835的博客
07-03 201
移动端页面按钮或者图标，点击的瞬间会有阴影，这是浏览器自带的，要去除这个阴影可以在css样式里加上以下属性：-webkit-tap-highlight-color: rgba(0,0,0,0);-webkit-tap-highlight-color: transparent; 转载于:https://www.cnblogs.com/xiaozhangzhang/p/9257324.ht...
移动端a标签点击图片有阴影处理
WEB_HW
02-19 4003
移动端我们在点击页面中的一些图片的时候会出现阴影。处理方法只要给a标签加上a { -webkit-tap-highlight-color: transparent; -webkit-touch-callout: none; -webkit-user-select: none; }
移动端div，a，img点击会出现阴影的处理
JunedQQ的博客
12-02 884
div,a,img { -webkit-tap-highlight-color: transparent; }
移动端，div点击瞬间，去掉出现阴影问题。
白白的博客
10-11 872
/移动端，div点击瞬间，出现阴影问题。/ div,a,img { -webkit-tap-highlight-color: transparent; -webkit-touch-callout: none; -webkit-user-select: none; user-select:none; }
Python.pyqt窗口点击按钮触发事件生成子窗口——解决子窗口闪现问题
weixin_56068397的博客
03-18 2243
子窗口闪现： 当对某一窗口的按钮绑定事件后，点击该按钮，我的本意是想要通过点击按钮来创建一个子窗口并将其显示（但是出现了闪现）——我将创建子窗口和子窗口显示都放在一个触发事件当中。（导致闪现问题的代码如下） 错误代码： # 弹出划分区域窗口（绑定方法） def showPic(self): //这是子窗口中用来创建窗口对象的 labelWin = MyWindow2() labelWin.show() 但是让我疑惑的是，无论怎么点击按钮，虽然会触发绑定事件但是子
JavaScript实现多级联动浮动菜单的HTML解决方案
“事件处理”确保用户交互能够被正确捕获和响应，比如防止默认行为、阻止事件冒泡造成误触、添加延迟关闭机制避免频繁闪现等问题。 “动态菜单”表明该菜单支持运行时内容变更，可能是基于不同用户权限加载不同选项...
你不知道的5个HTML5API
01-31
一提到HTML5，你脑海里是不是闪现这样的画面：“一大堆脱衣舞女和独角兽走进房间，然后演奏着 I’mSexyandIknowit”。产生这样的想法难道是我们的错吗？API的停滞不前，使一些基本的特性，例如使用“占位符”都需要...
移动web在ios和android下点击元素出现阴影问题
寂寞的天空的博客
01-12 1569
移动web开发经验总结 1、-webkit-tap-highlight-color:rgba(255,255,255,0)可以同时屏蔽ios和android下点击元素时出现的阴影。备注：transparent的属性值在android下无效。 2、-webkit-appearance:none可以同时屏蔽输入框怪异的内阴影。 3、-webkit-transform:translate3
点击H5页面的时候出现阴影
weixin_34008805的博客
12-04 1285
1.bug描述 顺利的写完了页面，放到了线上，打开手机点开之后，点击某一个按钮时，会出现一个阴影部分， 2.解决办法 查看一些资料，发现就是点击事件css加载出的一种样式，所以css提供了一个属性： .class{-webkit-tap-highlight-color:transparent;} 复制代码这个样式作用就是可以设置点击效果的一种提示样式； 把这个属性设置在点击元素的父元素上，就可以进...
去除手机页面点击元素的阴影
kwin的博客
12-31 1590
手机端部分浏览器，tap后会出现一个半透明的灰色背景，这是tap后的背景高亮，要重设这个表现，则需要设置-webkit-tap-highlight-color为所需色彩，直接透明吧：a, img, button, input, textarea { -webkit-tap-highlight-color: rgba(0,0,0,0); -webkit-tap-highlight-co
解决移动端页面点击图标或按钮产生透明灰色背景
lily2016n的博客
10-13 4325
html,body{-webkit-text-size-adjust: 100%;-webkit-tap-highlight-color: rgba(0, 0, 0, 0);}
网站整体变灰色
weixin_33748818的博客
04-23 171
<body  style="filter:Gray">
html 弹窗之后页面变灰色,点击后画面弹框背景变灰阴影层
weixin_29944865的博客
06-03 2655
实现页面功能的时候经常会遇到一个小功能需求：点击画面一个按钮，画面弹出信息页面，同时背景变暗(背景变暗其实是有个灰色半透明的全屏div遮住了原来的页面)且不可操作，信息页面操作关闭后恢复正常。先简要理一下实(shuo)现(ren)思(hua)路：点击事件之后要呈现半透明灰色背景挡住原页面灰色背景之上弹出对话框(或是信息页面)对话框关闭按下之后，对话框消失灰色背景消失html、css方面：信息页面得...
html表单按钮灰色,点击提交按钮后按钮变灰色不可用状态的三种方法
weixin_39996141的博客
06-07 3931
第一种方法：直接按钮中加入当点击提交后，提交按钮变灰色不可用，这样可有效防止重复提交，本代码就是实现这样一个功能。从代码就可以看出，我们只需在提交按钮上加入这一句： onclick="javascript:{this.disabled=true;document.form1.submit();}"，意思是当按钮点击后，将按钮的不可用属性设置为true，这样按钮就变灰了表单提交后按钮变成灰色[Ctr...
（仿头条APP项目）6.点击过的新闻列表文字变灰和下拉刷新与滚动加载新闻数据
我真的很不错的博客
06-04 1142
文章目录一.点击过的新闻列表文字变灰效果图实现思路导入ormlite数据库类依赖利用ormlite创建数据库和表创建数据库类MyDbHelper创建数据库中的新闻实体类NewInfo页面事务代码编写列表点击事件在getView中判断列表内容是否被点击过创建queryIdInDb方法查询当前新闻是否存在数据库中根据是否存在数据库表来改变标题与日期的颜色二.下拉刷新与滚动加载新闻数据效果图实现思路MyApi中添加获取下一页url地址的类页面事务代码编写添加滚动与下拉刷新器下拉刷新滚动加载总代码 一.点击过的新闻
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
红包 添加红包
表情包 插入表情
表情包 代码片
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值