zoukankan      html  css  js  c++  java
  • a:active在ios上无效解决方法

    原因:

    By default, Safari Mobile does not use the :active state unless there is a 
    touchstart event handler on the relevant element or on the <body>.

    解决方法:

    1.body标签上添加ontouchstart空方法(页面首个元素起作用)

    <body ontouchstart="">
    
    </body>

    2.document或body添加touchstart空事件(页面首个元素起作用)

    document.addEventListener("touchstart", function() {},false);
    //
    document.body.addEventListener("touchstart", function() {})

    /*添加如下css配合*/
    html {
      -webkit-tap-highlight-color: rgba(0,0,0,0);
    }
    

      

    3.单个a元素添加ontouchstart空事件

    <a ontouchstart="">Click me</a>

    4.所有a元素添加touchstart空事件

    var a=document.getElementsByTagName(‘a’);
    
    for(var i=0;i<a.length;i++){
    
        a[i].addEventListener(‘touchstart’,function(){},false);
    
    }


    参考:https://stackoverflow.com/questions/3885018/active-pseudo-class-doesnt-work-in-mobile-safari
               http://blog.csdn.net/freshlover/article/details/43735273

  • 相关阅读:
    队列
    StringBuilder&StringBuffer 源码阅读
    八种基本类型的包装类
    Object 源码阅读
    String 类源码分析
    SpringBoot 启动流程
    BeanDefinition 实例化过程
    BeanDefinition 解析流程【解析所有配置类】
    BeanDefinition 实例
    切面触发过程
  • 原文地址:https://www.cnblogs.com/tangbuluo/p/7676077.html
Copyright © 2011-2022 走看看