欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  IT编程

使用CSS3在触屏上为按钮实现激活效果

程序员文章站 2023-11-10 13:59:58
:hover伪类在触屏上表现不完美,所以需要借助:active伪类的css来表现状态变化,在触屏上,:hover和:active也不是直接就起到作用的,这里要借助一个小小的hack... 13-09-27...
1. :hover伪类在触屏上表现不完美,在android的webview中,webkit会处理touch事件和mouse事件,当手指停留在按钮上,hover状态的确被触发,但是当手指保持接触屏幕并离开按钮,hover状态依然保留。所以需要借助:active伪类的css来表现状态变化。

2. 在触屏上,:hover和:active也不是直接就起到作用的,这里要借助一个小小的hack,在html的body中(或者目标元素上)添加 ontouchstart="" ,来邪恶地诱使webview监听touch事件。