html 手机端click 事件去掉黑色阴影效果

添加css样式

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

1、  -webkit-tap-highlight-color:

　　这个属性只用于iOS (iPhone和iPad)。

　　当你点击一个链接或者通过Javascript定义的可点击元素的时候，它就会出现一个半透明的灰色背景。要重设这个表现，你可以设置-webkit-tap-highlight-color为任何颜色。

2、-webkit-text-size-adjust

　　网页字体缩放样式

时间： 2024-10-20 22:34:49

html 手机端click 事件去掉黑色阴影效果的相关文章

html 手机端click 事件延迟问题(fastclick.js使用方法)

下载地址: fastclick.js 为什么存在延迟? 从点击屏幕上的元素到触发元素的 click 事件,移动浏览器会有大约 300 毫秒的等待时间.为什么这么设计呢? 因为它想看看你是不是要进行双击(double tap)操作. 1.引入fastclick.js 文件 1 <script type='application/javascript' src='fastclick.js'></script> 2.调用方法 普通调用: 1 window.onload = functio

手机端touch事件实现元素拖拽效果 2

经上次的手机端拖拽事件,再次经过完善修改,加入了元素不能拖出屏幕范围功能,并做了一个小的函数接口 ps:经落雨大神指点. 代码如下: var touchEvent = (function(){ var oDiv = document.getElementsByTagName('div')[0], //获取可拖动元素 oIpt = document.getElementsByTagName('input')[0], //记录拖动元素位置 oIpt1 = document.getElementsBy

JS 插件 fastclick.js 解决手机端click点击延迟

fastclick.js 什么用 加快手机的反映速度,测试是可以用的,很快... fastclick的js FastClick 是一个简单,易于使用的JS库用于消除在移动浏览器上触发click事件与一个物理Tap(敲击)之间的300延迟.它支持以下浏览器:Mobile Safari on iOS 3 and upwardsChrome on iOS 5 and upwardsChrome on Android (ICS)Opera Mobile 11.5 and upwardsAndroid B

jquerymobile，手机端click无效

1.直接把<script>放到html代码后面,不要放到@section里面. 2.使用代理.如下所示: <script type="text/javascript"> $('#nr_abstract a#btnShow').bind('click', function () { $('#nr_abstract').slideUp(); $('#nr_detail').slideDown(); }); $('#nr_detail a#btnHide').bind

手机端touch事件 jquery模拟

ontouchstart实现手机触屏中的hover效果 ontouchstart实现手机触屏中的hover效果 最近一直都在做手机网站的项目,会经常遇到手机屏幕触摸无交互效果,今天在一篇文章中看到模拟网页端hover效果的例子拿出来和大家分享下,已经使用效果还不错,大家可以根据下面的案例学下: 一.css样式: <style type="text/css">.inner { width: 100%; height: 100px; position: relative; }.

手机端小问题整理

1,tap后会出现一个半透明的灰色背景.起初以为是outline作怪,加上后发现没反应.最后发现是tap后的背景高亮,要重设这个表现,则须要设置-webkit-tap-highlight-color为所需色彩.直接透明吧:a,img,button,input,textarea{-webkit-tap-highlight-color:rgba(255,255,255,0);} 2,另外,怎样去掉textarea,input的默认样式(IOS上的圆角及内阴影等,Android未測试):input,t

jQuery，zepto手机端用on将子元素事件委托给body或document无效

jQuery,zepto手机端用on将子元素事件委托给body或document无效 在移动端,绑定在普通的div元素上是可以的,但是绑定在body上无效,document也是无效. <!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8"> <meta name="viewport" content="width=d

PC端变成手机端的时候，把特效去掉（把canvas标签去掉）

PC端变成手机端的时候,把特效去掉(把canvas标签去掉)<script> if (screen.width < 768){ $('canvas').remove(); }</script> /*if($('window').width()<768){ $('canvas').css('display','none'); }*/ jQuery这种方法获取不到

自己动手丰衣足食，h5手机端jquery弹窗插件（事件冒泡、单例模式、遮盖部分禁止默认滚动）

感谢浏览,欢迎交流=.= 公司开发微信网页多处需要使用弹窗,使用jquery-ui的定制化下载仍需要150多kb,想来有些奢侈(最终下来只有11kb,压缩后2kb,啊,我的神), 手机端弹窗方式与pc端有些不同,而且手机上有一个弹窗出来滚动跟父页面滚动相互影响的问题, 于是决定写一个插件,专门对付手机网页的弹窗. 弹窗的mask和dialog两部分都做成了position=fixed,比较喜欢这种效果,并且屏蔽了被遮住部分的滚动. 几处认为需要留意的知识点或困难点: 1.事件冒泡: e.prev