解决移动端点击链接出现颜色块问题

移动端在点击链接跳转的时候会出现一个颜色块,看起来会闪一下,影响了用户体验。解决方法

就是添加一个css样式,改变其颜色,如下:

-webkit-tap-highlight-color: rgba(0,0,0,0);
时间: 2024-10-28 19:15:20

解决移动端点击链接出现颜色块问题的相关文章

手机网站点击链接触发颜色块的问题解决

引子 前段时间做微信页面的时候,一行内容做了2个链接,点击一个标签的时候,整个颜色块会闪一下,影响美观.需求针对这种情况来问我,能否把这个一闪的颜色去掉.我当时就想,这个怎么去?那我也不好直接回绝她,好吧,我试试吧!经过研究,百度的很多a标签都是一闪一闪的,有颜色块,但是淘宝和京东的手机端就没有这种情况,这是如何做到的呢? 研究 通过研究他们的代码发现,在根属性中,他们设置了这样的一个属性-webkit-tap-highlight-color:rgba(0,0,0,0). 下面解释一下什么是RG

手机浏览器wap网页点击链接触发颜色区块的问题解决办法

引子 在做HTML5 WAP网页的时候,一行内容做了2个链接,点击一个标签的时候,整个颜色块会闪一下,影响美观.需求针对这种情况来问我,能否把这个一闪的颜色去掉.我当时就想,这个怎么去?那我也不好直接回绝她,好吧,我试试吧!经过研究,百度的很多a标签都是一闪一闪的,有颜色块,但是淘宝和京东的手机端就没有这种情况,这是如何做到的呢? 研究 通过研究他们的代码发现,在根属性中,他们设置了这样的一个属性-webkit-tap-highlight-color:rgba(0,0,0,0). 下面解释一下什

fastclick.js --- 解决移动端点击事件300ms延时

Fast Click 是一个简单.易用的库,专为消除移动端浏览器从物理触摸到触发点击事件之间的300ms延时. 为什么会存在延迟呢? 从你触摸按钮到触发点击事件,移动端浏览器会等待接近300ms,原因是浏览器会等待以确定你是否执行双击事件 兼容性 Mobile Safari on iOS 3 and upwards Chrome on iOS 5 and upwards Chrome on Android (ICS) Opera Mobile 11.5 and upwards Android B

如何实现手机端点击链接跳转到手机QQ打开聊天界面

我们有时进一些网面或专题页面会自动弹出一个加为好友的对话框了,在研究了很久之后发现可以直接使用js来实现,下面我们一起来看js实现打开网页自动弹出添加QQ好友邀请窗口的方法. 第一步.JS脚本 这个是比较关键的,我们需要新建一个POP.JS脚本文件,我们也可以把下面的代码加入到网站已有的JS文件中. 1 var qq_chat = true; 2 function PlayJsAdPopWin() { 3 if (qq_chat) { 4 popwin = window.location.hre

怎么去除移动端点击a标签链接时的背景色

在手机端点击链接时会发现有一个背景色,有时候需要改变这个颜色,或者去除这个颜色,有时候a标签做成按钮时这个颜色的存在会很丑,像这样: 可以通过 -webkit-tap-highlight-color: rgba(0,0,0,0); 来去除这个高亮,这样在移动端点击按钮时就不会再有这个问题了

CSS设置点击前后的颜色变化

加到你的CSS样式表里body {color: #颜色代码 !important} /*设置全局没链接的文字颜色*/ a:link {color: #颜色代码 !important} /*设置全局未点击链接的颜色*/ a:visited {color: #颜色代码 !important} /*设置全局被点击后的链接颜色*/ a:hover {color: #颜色代码 !important} /*设置全局鼠标悬停在链接上未点击时的颜色*/ a:active {color: #颜色代码 !impor

微信内点击链接或扫描二维码可直接用外部浏览器打开H5链接的解决方案

很多朋友问我怎么解决微信内点击链接或扫描二维码可以直接跳出微信在外部浏览器打开网页链接,其实这并不难,只要我们实现微信跳转功能即可.下面给大家介绍这个功能 功能目的 生成微信跳转链接,实现微信内置浏览器跳转外部浏览器打开网页.(该方案适合推广APP及其他H5页面) 功能效果 功能实现后, 苹果用户即可在微信内直接下载app也可以跳转浏览器下载,安卓用户则自动打开手机浏览器下载app, 如果不含下载文件,则直接从微信内跳转到外部浏览器访问指定页面 .下面是含app下载文件的实现效果: 1. 苹果跳

ASP.NET MVC 防止前端点击劫持

前端点击劫持的原理:通过向我们的页面中添加Iframe,并将Iframe设置成透明,在页面相应的地方设置一些操作引导,让用户在不知不觉中发送一些请求. 解决前端点击劫持的手段就是在服务器端的响应报文中增加X-Frame-Options配置.X-Frame-Options值有3种: 1.DENY:无论如何不在框架中显示. 2.SAMEORIGIN: 仅在同源域名下的框架中显示. 3.ALLOW-FROM uri:仅在指定域名下的框架中显示. 配置X-Frame-Options的手段也有多种: 1.

取消a标签在移动端点击时的背景颜色

一.取消a标签在移动端点击时的蓝色  -webkit-tap-highlight-color: rgba(255, 255, 255, 0);  -webkit-user-select: none;  -moz-user-focus: none;  -moz-user-select: none; 二.使用图片作为a标签的点击按钮时,当触发touchstart的时候,往往会有一个灰色的背景 a,a:hover,a:active,a:visited,a:link,a:focus{     -webk