问题8:手机端实现点击按钮时更换颜色(解决IOS不显示背景)

CSS:

.sval:active, .sval:focus{
   background: #999;color:#fff;opacity:50;
} 

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

HTML:

<body ontouchstart="">

或:javaScript:

<script  type="text/javascript">

//相应苹果手机触屏(:active:focus)
document.body.addEventListener(‘touchstart‘, function () {});

</script>

原文地址:https://www.cnblogs.com/wuss/p/9024140.html

时间: 2024-11-11 03:49:29

问题8:手机端实现点击按钮时更换颜色(解决IOS不显示背景)的相关文章

初识安卓小程序(点击按钮切换屏幕颜色)

如图,点击按钮就会切换屏幕的颜色 首先,先创建一个安卓项目(我的版本是4.4.2的),名字为"world",当然,也可以别的名称 然后在res文件夹下找到layout文件夹,找到activity_main.xml或fragment_main.xml,在里面输入或拖拽按钮 <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="htt

问题1:默认div隐藏,点击按钮时出现,再点击时隐藏。

例:默认div隐藏,点击按钮时出现,再点击时隐藏. <a href="#" onclick="f('ycbc')"; >控制按钮</a> <div id="ycbc" style="display:none">隐藏的内容</div> 解决方法一:javascript 利用onclick事件调用f('ycbc')函数,参数为隐藏的内容div的id,在函数加入钮时出现,再点击时隐藏代

modalDialog的使用,图片切换,点击图片时打开一个窗体,并显示信息

//主窗体 //与open的区别:1.参数二是传递的参数 2.属性设置格式:属性=属性值; 3.dialogHeight与dialogWidth没有单位,即需要自己加上px //window.showModalDialog //("modalDialog.html",window,"dialogHeight=300px;dialogWidth=300px;scroll=yes;status=yes;dialogTop=100;dialogLeft=100;resizable=

去掉firefox点击按钮时的虚线边框

去掉火狐里面点击按钮时候的虚线边框 button::-moz-focus-inner, input[type="reset"]::-moz-focus-inner, input[type="button"]::-moz-focus-inner, input[type="submit"]::-moz-focus-inner, input[type="file"] > input[type="button"

初学ToggleButton 点击按钮,更换按钮背景图片;再次点击,恢复之前背景图

上方的图标,R.drawable.register_checked  是选中图片 下方的图标,   R.drawable.register_unchecked 是未选中图片 默认是上方的选中效果.点击按钮,取消选中:再次点击按钮,再次选中. 其实这是两张图片.关键在于图片必须跟着按钮改变. 一开始想用Button实现,纠结了很久,只有按上去和松开的效果,并没有点击后变背景图片的效果. 后来百度了很久,找到可以 用ToggleButton实现我想要的效果,在这里与大家分享. XML: androi

chrome 获得点击按钮时的事件

初次了解浏览器高级点的功能,原来这么强 想了解点击一个网页的按钮时触发了什么事件,firefox chrome确实很强大,基本可以监控所有内容 以chrome为例: 在按钮上 右键检查 或者 F12  就可以查看网页源代码,查看该按钮触发什么事件与什么事件绑定 在tab页 sources 可以查看对应的js代码  左下角"{}"可以把js代码格式化成友好格式 tab页 network ,这个时候点击按钮可以查看发送的具体请求,在你找到该按钮触发的请求上点击右键 - copy-copy

鼠标点击连接时的颜色

加到你的CSS样式表里body {color: #颜色代码 !important} /*设置全局没链接的文字颜色*/a:link {color: #颜色代码 !important} /*设置全局未点击链接的颜色*/a:visited {color: #颜色代码 !important} /*设置全局被点击后的链接颜色*/a:hover {color: #颜色代码 !important} /*设置全局鼠标悬停在链接上未点击时的颜色*/a:active {color: #颜色代码 !important

dede手机端首页点击文章内容、列表,却跳到pc端

手机访问到手机端首页,点击列表.内容.图片等都跳到pc端,是什么原因? 查看m模板里面的index.html文件生成的代码是绝对路径(数字随机)13.html 而不是view.php?aid=13 解决办法是什么? 首先在templets--------default---------找到index_m.html 打开index_m.html文件,查看调用代码 [field:arcurl /]这个调用代码是调用pc端的,只要换成view.php?aid=[field:id/]就可以正常跳转到手机

JS 插件 fastclick.js 解决手机端click点击延迟

fastclick.js 什么用 加快手机的反映速度,测试是可以用的,很快... fastclick的js FastClick 是一个简单,易于使用的JS库用于消除在移动浏览器上触发click事件与一个物理Tap(敲击)之间的300延迟.它支持以下浏览器:Mobile Safari on iOS 3 and upwardsChrome on iOS 5 and upwardsChrome on Android (ICS)Opera Mobile 11.5 and upwardsAndroid B