(1)前提:html页面 ,手机端,

(2)问题一:

在iphone上(貌似是9以后。。),给div/span/...等元素上加onclick事件,根本不起作用,这是为啥捏?

-- 在元素上加  cursor:pointer;  添加上后,系统会默认为这是一个可点击的元素。

1
cursor:pointer

  

(3)问题二:

在做手机页面时候,(iphone和安卓上都会有这个问题),点击一个按钮时,会出现的大黑块,特别不好看,怎么去掉大黑块儿呢?

--在元素上添加 -webkit-tap-highlight-color属性后,就可以去掉默认的大黑块儿

1
-webkit-tap-highlight-color: transparent;

  

(4)问题三:

当我们去掉默认的大黑块儿后,要添加自己想要的点击时按住按钮的效果,用以下代码:

1
2
3
4
span:active{
box-shadow: inset 0 5px 10px #B41313,inset 0 -5px 10px #B41313;
}
      

  

添加完上述代码后,在安卓上,都可以看到想要的效果,但是iphone上依旧无动于衷。。。。。

怎么办?

经过查资料和实际测试后,发现,:active  需要一个触发事件才可以,于是乎,用以下代码:

1
2
3
4
<script type="text/javascript">
document.body.addEventListener('touchstart', function () {
});
</script>

  

在页面上给一个监听事件,就可以触发:active,就可以兼容iphone上点击按下时的效果了!!!

【IOS】点击按钮-去高亮-加点击效果的更多相关文章

  1. iOS扩大UIButton按钮的可点击区域

    一.开发中遇到的问题 我们在开发时有时遇到这中情况:UI给的图片很小,button的点击区域要求比较大.如果用 setBackgroundImage: 方式设置图片会导致图片也跟着button的fra ...

  2. vue自己写了一个div菜单,点击按钮展开,点击其他地方关闭这个div菜单

    需求是通过点击body页面,在其他地方就关闭这个<div>菜单,给这个div一个id:problemList,但是点击我打开的按钮,不关闭. created () { document.o ...

  3. 家庭记账本app进度之关于单选按钮的相关操作(添加点击按钮事件以及点击单选更改事件)

    这次主要是通过代码实现了android中的相关单选按钮的相关操作,之后再最下面有一个按钮,当点击这个按钮的时候,会获取当上面的相关信息,之后再下方会进行相应的文字显示,获取的信息不同显示的信息也不会一 ...

  4. iOS开发 点击跳转到App Store 或者 点击按钮去评价

    //跳转到应用页面 NSString *str = [NSString stringWithFormat:@"http://itunes.apple.com/us/app/id%d" ...

  5. iOS 增加UIButton按钮的可点击区域

    在很多时候,按钮可能看起来那么大,但是在它周围进行点击时,都能够触发事件,是因为它的可点击区域比我们看到的button要大. 在使用AutoLayout的时候,我们处理的是按钮的image属性,所以这 ...

  6. jq 点击按钮显示div,点击页面其他任何地方隐藏div

    css .bl_rencai_32{ float: left; height: 35px; line-height: 35px; } .bl_rencai_32 >input{ width: 3 ...

  7. vue 点击按钮弹窗,点击关闭按钮关闭弹窗。

    <div @click="btnfc()">点击弹窗按钮</div> <div v-show="show"> <div ...

  8. jQuery第三课 点击按钮 弹出层div效果

    jQuery 事件方法 事件方法会触发匹配元素的事件,或将函数绑定到所有匹配元素的某个事件. 触发实例: $("button#demo").click() 上面的例子将触发 id= ...

  9. javascript 点击按钮实现隐藏显示切换效果

    原文链接:http://www.jb51.net/article/79083.htm <html> <head> <meta charset="gb2312&q ...

  10. ios禁用多按钮同时点下的效果

    只需要把那些不能同时点下的按钮或者视图设置一下即可. [view setExclusiveTouch:YES]; 避免view上多个button同时按下,则可设置每个button的setExclusi ...

随机推荐

  1. ubuntu 14.04安装pycharm 社区版

    https://blog.csdn.net/u013733432/article/details/54425831 转载于:https://www.cnblogs.com/liu-shiliu/p/1 ...

  2. 澳大利亚公共服务部门神速完成Win10部署:4个月完成44000台设备升级

    不到一年时间,澳大利亚公共服务部门已经完成Win10系统部署升级,涉及到全部的35000名员工.在2015年,澳大利亚公共服务部门IT员工告知微软,需要更创新的方式远程为居民提供服务,并且效率要更快. ...

  3. Flash调用Alchemy编译的代码时出现Error #1506的解决

    Flash调用Alchemy编译的代码时出现Error #1506的解决这个问题困扰了我很久,因为需要频繁的向Alchemy代码中传递大ByteArray数组.当某次传递的数据量较大时,后面再调用时就 ...

  4. apache调优技巧之一隐藏apahce版本信息

    如果你的服务器版本信息是这样的,是很 危险的. [root@xinsz63 httpd-2.2.27]# curl -I 192.168.1.38 HTTP/1.1 403 Forbidden Dat ...

  5. 如何用Hexo搭建个人博客

    以前用Wordpress搭建过一个博客网站,Wordpress虽然安装简单,功能强大,但是对于个人建站来说有点复杂了.最近发现用Hexo建站很流行,于是将网站从Wordpress迁移到了Hexo. H ...

  6. 软件——IDEA 超实用使用技巧分享

    前言 工欲善其事 ​必先利其器 最近受部门的邀请,给入职新人统一培训IDEA,发现有很多新人虽然日常开发使用的是IDEA,但是还是很多好用的技巧没有用到,只是用到一些基本的功能,蛮浪费IDEA这个优秀 ...

  7. 在web项目中使用shiro(记住我功能)

    第一步,添加“记住我”复选框,rememberMe要设置参数 第二步,配置shiro的主配置文件 注意 rememberMeCookie对应的bean中要声明 <constructor-arg ...

  8. 001_python变量,if,while

    Python介绍 python的出生与应用 python的创始人为吉多·范罗苏姆(Guido van Rossum).1989年的圣诞节期间,吉多·范罗苏姆(中文名字:龟叔)为了在阿姆斯特丹打发时间, ...

  9. CSS躬行记(10)——CSS方法论

    方法论是一个哲学术语,会对一系列具体的方法进行分析研究.系统总结并最终提出较为一般性的原则.CSS方法论是一种面向CSS.由个人和组织设计.已被诸多项目检验且公认有效的最佳实践.这些方法论都会涉及结构 ...

  10. 【Poj-3693】Maximum repetition substring 后缀数组 连续重复子串

    POJ - 3693 题意 SPOJ - REPEATS的进阶版,在这题的基础上输出字典序最小的重复字串. 思路 跟上题一样,先求出最长的重复次数,在求的过程中顺便纪录最多次数可能的长度. 因为sa数 ...