如果你的hover事件和click事件的样式不同,如元素背景本来是#fff,如果hover时背景是#ddd,点击时背景是#aaa,那么问题是当你点击后,鼠标再移动到这个元素时背景会变成#ddd,而你希望保持#aaa。

方法1:

var styleObj= document.styleSheets[0].cssRules[0].style;
styleObj.removeProperty('color');
styleSheets表示样式表
cssRules表示样式表里的样式
此方法需要知道hover事件在样式表中的顺序
不推荐
方法2:

.nav ul li:hover{
background: #ddd;
}

.active{
background: url('images/ico.gif') no-repeat center bottom;
background-color: #aaa;
color: #000!important;
}
.active:hover{
background: url('images/ico.gif') no-repeat center bottom!important;
background-color: #aaa!important;
color: #000!important;
}

 

hover与click样式冲突的更多相关文章

  1. 百度地图api的覆盖物样式与bootstrap样式冲突解决办法

    使用百度地图api 和 bootstrap ,发现标注样式出现了问题 label左侧 宽度变得非常窄 正常情况下应该是下面这样的: 原因是boostrap样式和百度地图样式冲突了. 解决办法: .ba ...

  2. SharePoint 2010 中使用Ztree和EasyUI样式冲突问题

    <style type="text/css"> /*解决ztree和SharePoint样式冲突问题*/ .ztree li a { display: inline-b ...

  3. jquery href属性和click事件冲突

    a标签的定义如下: <a href="javascript:void(0);">test</a> jquery中的click事件: $("a&qu ...

  4. css 样式冲突问题

    CSS 样式冲突问题 问题: 当文件中样式名称相同时,易出现样式冲突问题,解决办法如下: 解决: 以 layer.js 中弹出层  .layui-layer-page .layui-layer-con ...

  5. css样式冲突怎么解决?

    一个网页有时会使用两种CSS,那发生css样式冲突要怎么解决?下面本篇文章就来给大家介绍一下发生css样式冲突的解决方法,希望对大家有所帮助. css冲突怎么解决? 解决方法有很多,如果可以对html ...

  6. react 样式冲突解决方案 styled-components

    前置 在 react 中解决组件样式冲突的方案中,如果您喜欢将 css 与 js 分离,可能更习惯于 CSS-Modules:如果习惯了 Vue.js 那样的单文件组件,可能习惯于使用 styled- ...

  7. 第七十三篇:解决Vue组件中的样式冲突

    好家伙, 1.组件之间的样式冲突 默认情况下,写在.vue组件中的样式会全局生效,因此很容易造成多个组件之间的样式冲突问题. 举个例子: 我们在Left.vue的组件中添加样式 <templat ...

  8. js(jquery)解决input元素的blur事件和其他非表单元素的click事件冲突的方法

    HTML结构:很简单,就一个input,一个div,能说明问题就OK了: <input type="text" value="默认值"><br ...

  9. blur和click事件冲突

    一.问题描述文本框的blur事件和div元素的click事件出现冲突.在input的blur事件中,我们隐藏div元素.在div的click事件中,我们清除input的内容,并隐藏自身.当我们在inp ...

随机推荐

  1. 201521123110《java程序设计》第八周学习总结

    1. 本周学习总结 2. 书面作业 1.List中指定元素的删除 上课就交了,编写时主要用remove方法,然后Iterator的remove()方法可删除当前下标为i的元素后,该元素后的所有元素将往 ...

  2. 201521123093 java 第七周学习总结

    1. 本周学习总结 2. 书面作业 1.ArrayList代码分析 1.1 解释ArrayList的contains源代码 //contains()方法 public boolean contains ...

  3. 201521123023《Java程序设计》第6周学习总结

    1. 本周学习总结 2. 书面作业 1.clone方法 1.1 Object对象中的clone方法是被protected修饰,在自定义的类中覆盖clone方法时需要注意什么? 实现克隆必须实现Clon ...

  4. 201521123071《Java程序设计》第1周学习总结

    1. 本章学习总结 通过本周的学习,对java的一些语法以及java的发展史有了一定的基础认识,也了解了JDK的安装,以及环境变量定义和配置等知识.还有对码云,Markdown等的使用,大大方便了我们 ...

  5. RAID磁盘阵列

    什么是RAID 独立硬盘冗余阵列(RAID, Redundant Array of Independent Disks),简称磁盘阵列.其基本思想就是把多个相对便宜的硬盘组合起来,成为一个硬盘阵列组, ...

  6. 在linux环境下搭建java web测试环境(非常详细!!)

    一.项目必备软件及基本思路 项目必备:虚拟机:VMware Workstation (已安装linux的 CentOS6.5版本) 项目:java web项目 (必须在本地部署编译后选择项目的webR ...

  7. mysql水平分表和垂直分表的优缺点

    表分割有两种方式: 1.水平分割:根据一列或多列数据的值把数据行放到两个独立的表中. 水平分割通常在下面的情况下使用. •表很大,分割后可以降低在查询时需要读的数据和索引的页数,同时也降低了索引的层数 ...

  8. ASP.NET Core 认证与授权[1]:初识认证

    在ASP.NET 4.X 中,我们最常用的是Forms认证,它既可以用于局域网环境,也可用于互联网环境,有着非常广泛的使用.但是它很难进行扩展,更无法与第三方认证集成,因此,在 ASP.NET Cor ...

  9. 复选框demo

    本篇文章是关于复选框的,有2种形式:1.全选.反选由2个按钮实现:2.全选.反选由一个按钮实现. <!DOCTYPE html> <html> <head> < ...

  10. jdk版本查看,以及java -version 和JAVA_HOME不一致问题

    一.jdk版本查看及位数查看 在cmd进入命令行窗口,输入java -version 可以查看安装的jdk版本,如图: 当有64-bit时代表是64位jdk,如果没有则默认是32位的. 二.java ...