zoukankan      html  css  js  c++  java
  • 手机端css实现active伪类

    今天遇到手机端的css中a标签的active不起作用,原本想循环a标签,给当前的a标签添加class来解决,可觉得有点儿小麻烦,经查资料了解到解决此问题,只需要添加一个touchstart的空事件即可。

    例子如下:

    <!DOCTYPE html>
    <html lang="en">
    <head>
    <meta charset="UTF-8">
    <title></title>
    <style>
    *{ margin:0; padding:0; }
    .domain a{ display:inline-block; border:1px solid #ccc; padding:5px 10px; margin:10px; }
    .domain a:active{ background-color:#c00; color:#fff; }
    </style>
    </head>
    <body>
    <div class="domain" id="js-domain">
    <a href="#">点击1</a>
    <a href="#">点击2</a>
    </div>

    <script>
    window.onload = function(){
    var doma=document.getElementById("js-domain").getElementsByTagName('a');
    for(var i=0;i<doma.length;i++){
    doma[i].addEventListener('touchstart',function(){},false);
    };
    }
    </script>

    </body>
    </html>

  • 相关阅读:
    十大排序算法
    SQL优化指南
    Python基础-类与对象
    Python基础-函数
    Python基础-字典
    Python基础-字符串
    Python基础-列表
    以太坊智能合约开发框架Truffle
    比特币钱包搭建与使用
    矩阵的压缩存储
  • 原文地址:https://www.cnblogs.com/cyj7/p/4569310.html
Copyright © 2011-2022 走看看