当前位置:  开发笔记 > 前端 > 正文

在移动Safari/Webview中防止touchstart上的灰色叠加

如何解决《在移动Safari/Webview中防止touchstart上的灰色叠加》经验,为你挑选了2个好方法。

我正在webkit中构建一个iOS应用程序,所以我的整个UI都是一个webview.在webview外边界附近的任何元素的touchStart上(没有绑定到它的touchStart事件),我得到一个半透明的灰色框覆盖webview的整个区域.我已经消除-webkit-tap-highlight-color-webkit-touch-callout作为原因.如何删除此行为?



1> Kornelius..:

只是把这种风格,你仍然有默认的动作,但没有灰色叠加

a {
    -webkit-tap-highlight-color: rgba(0,0,0,0);
}

如果你想删除动作面板,只需把它

a {
    -webkit-tap-highlight-color: rgba(0,0,0,0);
    -webkit-touch-callout: none;
}

你去吧!最后清理链接!


这太棒了,你能告诉我你是怎么发现的吗,我一直在搜索一个webkit前缀/伪类的列表,用于safari mobile但什么都没发现.
奇迹般有效.我用*{-webkit-tap-highlight-color:rgba(0,0,0,0); 从一切中删除它

2> Andrew Shoon..:

我的工作解决方案是捕获和阻止对touchstarthtml文档正文事件的默认.所有其他更明确的事件处理程序不受影响.我确实遇到了select元素的问题,我在body事件处理程序中解决了(我使用的是jQuery):

$('body').live(
'touchstart', 
function(e){
    if(e.target.localName != 'select'){
        e.preventDefault(); 
    }
}

)

推荐阅读
保佑欣疼你的芯疼
这个屌丝很懒,什么也没留下!
DevBox开发工具箱 | 专业的在线开发工具网站    京公网安备 11010802040832号  |  京ICP备19059560号-6
Copyright © 1998 - 2020 DevBox.CN. All Rights Reserved devBox.cn 开发工具箱 版权所有