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


Posted in HTML / CSS onSeptember 27, 2013

1. :hover伪类在触屏上表现不完美,在Android的WebView中,WebKit会处理touch事件和mouse事件,当手指停留在按钮上,hover状态的确被触发,但是当手指保持接触屏幕并离开按钮,hover状态依然保留。所以需要借助:active伪类的css来表现状态变化。

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

HTML / CSS 相关文章推荐
CSS3 仿微信聊天小气泡实例代码
Apr 05 HTML / CSS
HTML5中视频音频的使用详解
Jul 07 HTML / CSS
html5 Canvas画图教程(11)—使用lineTo/arc/bezierCurveTo画椭圆形
Jan 09 HTML / CSS
html5的canvas方法使用指南
Dec 15 HTML / CSS
使用HTML5 Canvas为图片填充颜色和纹理的教程
Mar 21 HTML / CSS
canvas学习总结三之绘制路径-线段
Jan 31 HTML / CSS
h5移动端调用支付宝、微信支付的实现
Jun 08 HTML / CSS
前端水印的简单实现代码示例
Dec 02 HTML / CSS
canvas版人体时钟的实现示例
Jan 29 HTML / CSS
HTML5 新增内容和 API详解
Nov 17 HTML / CSS
CSS中float高度塌陷问题的四种解决方案
Apr 18 HTML / CSS
CSS 实现磨砂玻璃(毛玻璃)效果样式
May 21 HTML / CSS
纯CSS3实现带动画效果导航菜单无需js
Sep 27 #HTML / CSS
css3中background新增的4个新的相关属性用法介绍
Sep 26 #HTML / CSS
CSS3用@font-face实现自定义英文字体
Sep 23 #HTML / CSS
CSS3媒体查询(Media Queries)介绍
Sep 12 #HTML / CSS
利用CSS3的特性改变文本选中时的颜色
Sep 11 #HTML / CSS
css3进行截取替代js的substring
Sep 02 #HTML / CSS
CSS3制作ajax loader icon实现思路及代码
Aug 25 #HTML / CSS
You might like
PHP similar_text 字符串的相似性比较函数
2010/05/26 PHP
php 求质素(素数) 的实现代码
2011/04/12 PHP
php添加文章时生成静态HTML文章的实现代码
2013/02/17 PHP
PHP类继承 extends使用介绍
2014/01/14 PHP
Linux安装配置php环境的方法
2016/01/14 PHP
php连接sftp的作用以及实例代码
2019/09/23 PHP
JavaScript Event学习第五章 高级事件注册模型
2010/02/07 Javascript
input 和 textarea 输入框最大文字限制的jquery插件
2011/10/27 Javascript
JS实现向表格行添加新单元格的方法
2015/03/30 Javascript
JavaScript中常见的字符串操作函数及用法汇总
2015/05/04 Javascript
BootStrap智能表单实战系列(十一)级联下拉的支持
2016/06/13 Javascript
js 获取范围内的随机数实例代码
2016/08/02 Javascript
深入分析node.js的异步API和其局限性
2016/09/05 Javascript
jQuery特殊符号转义的实现
2016/11/30 Javascript
Bootstarp 基础教程之表单部分实例代码
2017/02/03 Javascript
JS正则获取HTML元素的方法
2017/03/31 Javascript
JS自动生成动态HTML验证码页面
2017/06/14 Javascript
深入理解vue中slot与slot-scope的具体使用
2018/01/26 Javascript
Vue源码探究之状态初始化
2018/11/14 Javascript
从零开始在NPM上发布一个Vue组件的方法步骤
2018/12/20 Javascript
在vue中axios设置timeout超时的操作
2020/09/04 Javascript
js实现限定区域范围拖拉拽效果
2020/11/20 Javascript
python正则表达式中的括号匹配问题
2014/12/14 Python
Python使用中文正则表达式匹配指定中文字符串的方法示例
2017/01/20 Python
解决Matplotlib图表不能在Pycharm中显示的问题
2018/05/24 Python
Python中Proxypool库的安装与配置
2018/10/19 Python
软件测试题目
2013/02/27 面试题
薪酬专员岗位职责
2014/02/18 职场文书
采购意向书范本
2014/03/31 职场文书
病人写给医生的感谢信
2015/01/23 职场文书
行政助理岗位职责
2015/02/10 职场文书
2015年建党94周年演讲稿
2015/03/19 职场文书
应聘教师自荐信
2015/03/26 职场文书
2015年幼儿教师个人工作总结
2015/05/20 职场文书
有关骆驼祥子的读书笔记
2015/06/26 职场文书
Vue的过滤器你真了解吗
2022/02/24 Vue.js