使用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进度条效果
Feb 22 HTML / CSS
移动Web—CSS为Retina屏幕替换更高质量的图片
Dec 24 HTML / CSS
可以随进度显示不同颜色的css3进度条分享
Apr 11 HTML / CSS
纯CSS实现菜单、导航栏的3D翻转动画效果
Apr 23 HTML / CSS
CSS3属性box-shadow使用指南
Dec 09 HTML / CSS
详解css3中的伪类before和after常见用法
Nov 17 HTML / CSS
浅谈HTML5新增及移除的元素
Jun 27 HTML / CSS
用HTML5 实现橡皮擦的涂抹效果的教程
May 11 HTML / CSS
HTML5 新标签全部总汇(推荐)
Jun 13 HTML / CSS
HTML5 canvas基本绘图之填充样式实现
Jun 27 HTML / CSS
html2canvas生成的图片偏移不完整的解决方法
May 19 HTML / CSS
CSS3实现指纹特效代码
Mar 17 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中static静态变量的使用方法详解
2010/06/04 PHP
Zend Studio去除编辑器的语法警告设置方法
2012/10/24 PHP
jquery自动完成插件(autocomplete)应用之PHP版
2009/12/15 Javascript
JavaScript中获取鼠标位置相关属性总结
2014/10/11 Javascript
JavaScript中的对象继承关系
2016/08/01 Javascript
vue2 router 动态传参,多个参数的实例
2017/11/10 Javascript
vue实现简单的星级评分组件源码
2018/11/16 Javascript
详解JS取出两个数组中的不同或相同元素
2019/03/20 Javascript
vue element中axios下载文件(后端Python)
2019/05/10 Javascript
Django+Vue实现WebSocket连接的示例代码
2019/05/28 Javascript
Node登录权限验证token验证实现的方法示例
2020/05/25 Javascript
nuxt.js添加环境变量,区分项目打包环境操作
2020/11/06 Javascript
[07:26]2015国际邀请赛第二日TOP10集锦
2015/08/06 DOTA
python端口扫描系统实现方法
2014/11/19 Python
跟老齐学Python之使用Python查询更新数据库
2014/11/25 Python
详解在Python和IPython中使用Docker
2015/04/28 Python
Python实现的简单hangman游戏实例
2015/06/28 Python
Python引用模块和查找模块路径
2016/03/17 Python
老生常谈Python startswith()函数与endswith函数
2017/09/08 Python
Python进阶之尾递归的用法实例
2018/01/31 Python
Python yield与实现方法代码分析
2018/02/06 Python
python中从str中提取元素到list以及将list转换为str的方法
2018/06/26 Python
python实现计数排序与桶排序实例代码
2019/03/28 Python
python3使用腾讯企业邮箱发送邮件的实例
2019/06/28 Python
解决pytorch 数据类型报错的问题
2021/03/03 Python
英国高档百货连锁店:John Lewis
2017/11/20 全球购物
初中学生期末评语
2014/04/24 职场文书
学校交通安全责任书
2014/08/25 职场文书
起诉离婚协议书样本
2014/11/25 职场文书
三八妇女节寄语
2015/02/27 职场文书
爱鸟护鸟的宣传语
2015/07/13 职场文书
《认识钟表》教学反思
2016/02/16 职场文书
python如何进行基准测试
2021/04/26 Python
python代码实现备忘录案例讲解
2021/07/26 Python
SQL Server表分区删除详情
2021/10/16 SQL Server
Python Numpy库的超详细教程
2022/04/06 Python