我在iOS的Safari移动的Browser上使用jQuery的on()
函数,如下所示:
$("#content").on(".element", click(function(){ do stuff});
字符串
当单击.element
时,Safari会突出显示整个#content
区域,而不仅仅是.element
所占的区域。
使用时
$(".element").click(function(){do stuff});
型
而是突出显示右侧区域。我想这是预期的行为,但它对用户来说一点也不直观,所以我正在寻找一种解决方法。
我知道我可以通过使用-webkit-tap-highlight-color: rgba(0,0,0,0);
完全摆脱突出显示,但我认为突出显示实际上非常有用,因为CSS的悬停在移动的设备上已经没有用了。
有没有一种方法可以使用jQuery的on函数和Safari移动的来获得.element
的点击突出显示?
1条答案
按热度按时间yvt65v4c1#
我用下面的方法解决了这个问题:
1.将
document.addEventListener("touchstart", function(){}, true);
放入文档就绪函数中,启用css:active
伪类1.完全禁用水龙头突出显示:
-webkit-tap-highlight-color: rgba(0,0,0,0);
个1.添加
.element:active{background: #cccccc;}
这样,点击的(活动的)元素在被触摸时会得到一个漂亮的灰色背景。