使用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教程(2):网页边框半径和网页圆角
Apr 02 HTML / CSS
8款精美的CSS3表单设计(登录表单/下拉选择/按钮附演示及源码)
Feb 04 HTML / CSS
CSS3打造百度贴吧的3D翻牌效果示例
Jan 04 HTML / CSS
css3实现文字首尾衔接跑马灯的示例代码
Oct 16 HTML / CSS
HTML5实现QQ聊天气泡效果
Jun 26 HTML / CSS
突袭HTML5之Javascript API扩展2—地理信息服务及地理位置API学习
Jan 31 HTML / CSS
html5小技巧之通过document.head获取head元素
Jun 04 HTML / CSS
HTML5使用drawImage()方法绘制图像
Jun 23 HTML / CSS
HTML5 Convas APIs方法详解
Apr 24 HTML / CSS
用HTML5制作烟火效果的教程
May 12 HTML / CSS
HTML如何让IMG自动适应DIV容器大小的实现方法
Feb 25 HTML / CSS
Canvas绘制像素风图片的示例代码
Sep 25 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
phpmyadmin打开很慢的解决方法
2014/04/21 PHP
laravel5.6框架操作数据curd写法(查询构建器)实例分析
2020/01/26 PHP
在iframe里的页面编写js,实现在父窗口上创建动画效果展开和收缩的div(不变动iframe父窗口代码)
2011/12/20 Javascript
JS删除数组元素的函数介绍
2013/03/27 Javascript
鼠标移到图片上变大显示而不是放大镜效果
2014/06/15 Javascript
jQuery新的事件绑定机制on()示例应用
2014/07/18 Javascript
indexOf 和 lastIndexOf 使用示例介绍
2014/09/02 Javascript
深入理解JavaScript系列(46):代码复用模式(推荐篇)详解
2015/03/04 Javascript
JavaScript驾驭网页-获取网页元素
2016/03/24 Javascript
Javascript数组中push方法用法分析
2016/10/31 Javascript
微信小程序 JS动态修改样式的实现代码
2017/02/10 Javascript
JavaScript实现QQ聊天消息展示和评论提交功能
2017/05/22 Javascript
浅谈 Vue v-model指令的实现原理
2017/06/08 Javascript
vue按需加载组件webpack require.ensure的方法
2017/12/13 Javascript
vue引入js数字小键盘的实现代码
2018/05/14 Javascript
Vue中的组件及路由使用实例代码详解
2019/05/22 Javascript
Element Steps步骤条的使用方法
2020/07/26 Javascript
python修改注册表终止360进程实例
2014/10/13 Python
git使用.gitignore设置不生效或不起作用问题的解决方法
2017/06/01 Python
Python实现查找字符串数组最长公共前缀示例
2019/03/27 Python
网易2016研发工程师编程题 奖学金(python)
2019/06/19 Python
Merrell迈乐澳大利亚网站:购买户外登山鞋
2017/05/28 全球购物
波兰办公用品和学校用品在线商店:Dlabiura24.pl
2020/11/18 全球购物
物流专业大学生的自我鉴定
2013/11/13 职场文书
质检员岗位职责
2013/12/17 职场文书
生日派对邀请函
2014/01/13 职场文书
七年级数学教学反思
2014/01/22 职场文书
《狼》教学反思
2014/03/02 职场文书
庆六一文艺汇演活动方案
2014/08/26 职场文书
入党政审材料范文
2014/12/24 职场文书
个园导游词
2015/02/04 职场文书
2015年办公室文员工作总结
2015/04/24 职场文书
催款函范文
2015/06/24 职场文书
莫言诺贝尔获奖感言(全文)
2015/07/31 职场文书
全家福照片寄语怎么写?
2019/04/02 职场文书
MySQL系列之二 多实例配置
2021/07/02 MySQL