使用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美化表单控件全集
Jun 29 HTML / CSS
CSS3 透明色 RGBA使用介绍
Aug 06 HTML / CSS
10分钟理解CSS3 FlexBox弹性布局
Dec 20 HTML / CSS
css3给背景图片加颜色遮罩的方法
Nov 05 HTML / CSS
html5+css3之制作header实例与更新
Dec 21 HTML / CSS
使用CSS3制作版头动画效果
Dec 24 HTML / CSS
详解HTML5表单新增属性
Dec 21 HTML / CSS
HTML5 声明兼容IE的写法
May 16 HTML / CSS
详解HTML5中ol标签的用法
Sep 08 HTML / CSS
推荐WEB开发者最佳HTML5和CSS3代码生成器
Nov 24 HTML / CSS
详解前端HTML5几种存储方式的总结
Dec 27 HTML / CSS
移动HTML5前端框架—MUI的使用
Dec 18 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
mysql5写入和读出乱码解决
2006/11/25 PHP
控制PHP的输出:缓存并压缩动态页面
2013/06/11 PHP
PHP去掉json字符串中的反斜杠\及去掉双引号前的反斜杠
2015/09/30 PHP
CodeIgniter配置之SESSION用法实例分析
2016/01/19 PHP
php版微信公众号自定义分享内容实现方法
2016/09/22 PHP
Yii2框架中日志的使用方法分析
2017/05/22 PHP
[原创]PHP正则删除html代码中a标签并保留标签内容的方法
2017/05/23 PHP
PHP面向对象程序设计内置标准类,普通数据类型转为对象类型示例
2019/06/12 PHP
PHP Swoole异步读取、写入文件操作示例
2019/10/24 PHP
用cssText批量修改样式
2009/08/29 Javascript
Js实现双击鼠标自动滚动屏幕的示例代码
2013/12/14 Javascript
JavaScript中的索引数组、关联数组和静态数组、动态数组讲解
2014/11/08 Javascript
用AngularJS来实现监察表单按钮的禁用效果
2016/11/02 Javascript
利用js来实现缩略语列表、文献来源链接和快捷键列表
2016/12/16 Javascript
layer弹出层中H5播放器全屏出错的解决方法
2017/02/21 Javascript
bootstrap模态框示例代码分享
2017/05/17 Javascript
js实现移动端轮播图效果
2020/12/09 Javascript
JS中的算法与数据结构之集合(Set)实例详解
2019/08/20 Javascript
基于Django的ModelForm组件(详解)
2017/12/07 Python
Python星号*与**用法分析
2018/02/02 Python
Python使用ctypes调用C/C++的方法
2019/01/29 Python
Pandas统计重复的列里面的值方法
2019/01/30 Python
啥是佩奇?使用Python自动绘画小猪佩奇的代码实例
2019/02/20 Python
Python爬虫学习之翻译小程序
2019/07/30 Python
Python使用matplotlib绘制Logistic曲线操作示例
2019/11/28 Python
python关于变量名的基础知识点
2020/03/03 Python
Python+unittest+requests 接口自动化测试框架搭建教程
2020/10/09 Python
python try...finally...的实现方法
2020/11/25 Python
C和C++经典笔试题附答案解析
2014/08/18 面试题
工业设计专业推荐信
2013/10/29 职场文书
幼儿园老师辞职信
2014/01/20 职场文书
建筑总经理岗位职责
2014/02/02 职场文书
21岁生日感言
2014/02/27 职场文书
2014年“四风”问题个人整改措施
2014/09/17 职场文书
升学宴祝酒词
2015/08/11 职场文书
Django基础CBV装饰器和中间件
2022/03/22 Python