IE的mouseover, mouseour透明颜色下的问题

最新推荐文章于 2022-03-09 16:51:00 发布
原创 最新推荐文章于 2022-03-09 16:51:00 发布 · 113 阅读 · 0 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。

本文介绍了在IE6至IE9浏览器中，当两个Div重叠且上方Div背景透明时，鼠标事件触发到下方Div的问题及解决方案。对于IE9，推荐使用RGBA背景；而对于IE7和IE8，则建议采用RGB背景结合Alpha滤镜实现透明效果。
[b]在IE6,7,8,9 中，都存在一种情况， 就是如果两个Div重叠在一起，如果上面的Div的背景色是transparet, 那么在上面Div写的mouseover, mouseout效果将触发到下面的Div，导致Div的事件失效问题。[/b]

解决方法，Ie9可以使用background-color: rgba(0,0,0,0); 即给一个透明的颜色覆盖住。 但是Ie7，8都不支持rgba。所以通用的方法是


background-color: rgb(0,0,0);
filter: alpha(opacity=0);
基于mouseout和mouseover等类似事件的冒泡问题解决方法
09-04
在本文中，我们将深入探讨`mouseout`和`mouseover`事件以及它们与事件冒泡相关的常见问题，同时提供一种有效的解决方案。 `mouseout`和`mouseover`事件是两种常用的DOM（文档对象模型）事件，用于追踪用户鼠标在...
IE应用了filter后mouseover事件异常
04-01
标题“IE应用了filter后mouseover事件异常”涉及的是在Internet Explorer浏览器中，当CSS滤镜（filter）属性被使用后，可能导致鼠标悬停事件（mouseover）处理程序出现不正常行为的问题。这个问题通常与IE浏览器特有...
JS实现鼠标滑过图片的抖动效果
weixin_38166931的博客
04-16 623
在上网时候发现了这个效果（效果演示地址：http://www.baidu.com/search/baike/usertask/mingmantianxia/）.在鼠标放到图片上， 图片会有个上下抖动的特效。很喜欢这种感觉。在于是摸索了一下，下面是一些步骤。1、查看源文件，在查看后很纳闷的发现，此页并没有包含那些奖品信息。这样就断定代码在另一个页面中。于是想当然的以为是用的框架连接的地址。...
IE7下的浮动弹出框背景透明，背景为黑色改为透明
遨游大海
05-04 735
最近在做公司页面时遇到一个问题，就是做了个点击弹出日计费流量浮动框，实现该功能了，在IE11-9下能正常运行，但是一到IE7，8下浮动框背景就是全黑色，并不是透明的，后面网上找了一会儿发现了解决方法，就是将浮动层样式背景颜色改为 background:transparent;这里的transpanrent好像有点学问，需要的自己去了解下。    .theme-popover-mask {
IE下mouseout、mouseover问题总结
sdtamk的博客
04-24 3532
2015-4-24使用css的hover样式做鼠标移上显示层，离开隐藏层的效果时，在Firefox浏览器下正常，在IE下（使用ie7）发现，在显示层上移动鼠标，一旦鼠标经过层遮挡的其他元素时（非该层元素），则会触发mouseout事件，当前层就会隐藏。如下图 正常情况下，鼠标经过显示层可以对内部元素进行选择，但是在ie（ie7）下，一旦鼠标经过遮挡层下的元素时，会导致显示层隐藏，效果就是触发
vue的mouseover等事件注册失败问题
Mo_zifeng的博客
11-02 3031
在vue项目中用到@mouseover事件，结果发现注册失败，网上搜了之后才知道，在vue中，注册@mouseover等鼠标操作（以mouse为前缀）事件，需要加上.native，例:@mouseover.native。...
简述在IE下mouseover和mouseenter的区别
chanda_yang的博客
08-18 1473
栗子一： script type="text/javascript" src="http://code.jquery.com/jquery-1.11.1.min.js">script> script type="text/javascript"> x=0; y=0; $(document).ready(function(){   $("d
mouseover闪烁问题
xiamoziqian的博客
07-09 939
问题： span标签绑定mouseover/mouseout事件，显示/隐藏一个信息框div。 悬停上去一直闪烁，改成mouseenter也没用。 原因： 悬停上去信息框div盖住了span标签，mouseover事件失效，mouseout事件生效，信息框消失。 信息框消失后鼠标又正好悬停在span标签上，mouseover事件生效，mouseout事件失效，信息框显示。。。 一直无限循环就会看到一直闪烁的现象。 解决：在你需要显示的信息框上加上 pointer-events: none 版权声明：本文为
解决mouseover闪烁的问题
sumtre_w的博客
09-08 2307
问题原因： 当鼠标移入一个元素，需要在该元素旁显示一个层，显示层遮住了添加事件的元素，所以反复执行 。 onmouseover onmouseout。 查资料总结： 方法一：把mouseover和mouseout换成对应的mouseenter和mouseleave。 当鼠标指针位于元素上方时，会发生 mouseover 事件。 该事件大多数时候会与 mouseout 事件一起使用。 注释：与 mouseenter 事件不同，不论鼠标指针穿过被选元素或其子元素，都会触发 mouseover 事件。只有在鼠标指
mouseover和mouseenter的区别？
weixin_47450807的博客
03-09 7468
一、写在前面 mouseover和mouseenter之间是存在区别的，但是平时在使用的时候并不知道他们的区别，所以一直都处于混用的状态，下面这篇博客主要来详细叙述一下这两者的区别。 二、不同点 mouseover和mouseenter最本质的区别是：mouseover支持事件冒泡，mouseenter不支持事件冒泡。 ①、触发A的mouseover和mouseenter事件 ②、触发A的mouseout和mouseover事件，触发B的mouseover和mouseenter事件 ③、触发A的mouse
js中鼠标事件mouseover、mouseenter和mouseleave、mouseout的区别
热门推荐
JackieDYH的博客
05-25 1万+
mouseover：当鼠标移入元素或其子元素都会触发事件，所以有一个重复触发，冒泡过程。对应的移除事件是mouseout mouseenter:当鼠标移除元素本身（不包含元素的子元素）会触发事件，也就是不会冒泡，对应的移除事件是mouseleave 异同体现在两个方面： 1. 是否支持冒泡 2.事件的触发时机 mouseenter事件的情况 当鼠标从元素的边界之外移入元素的边界之内时，事件被触发。而鼠标本身在元素边界内时，要触发该事件，必须先将鼠标移出元素边界外，再次移入才能触...
JS中mouseover和mouseout多次触发问题如何解决
10-22
针对标题“JS中mouseover和mouseout多次触发问题如何解决”，主要内容探讨的是在JavaScript中使用jQuery库时，处理mouseover和mouseout事件由于事件冒泡导致的多次触发问题。当用户使用鼠标在页面元素间移动时，这些...
给moz-firefox下添加IE方法和属性
10-30
### 给moz-firefox下添加IE方法和属性 #### 背景介绍 在Web开发过程中，由于不同的浏览器对Web标准的支持程度不一，开发者往往需要处理浏览器间的兼容性问题。尤其是在早期，Internet Explorer（IE）与其他现代...
斜坡算法
01-17 1129
斜坡算法, 通过canvas画斜坡的算法, 知道这个算法后, 就可以直接画出斜坡了 sinc(x * M) * sinc(y * M) //M是斜坡的倾斜度 可以看一个例子 [url]http://www.graphycalc.com/[/url]...
Ajax访问文件获取字节流方法
11-09 808
[code="js"]window.onload = function(){ var xhr = new XMLHttpRequest(); xhr.open('GET', "http://localhost:8080/myblog/helloworld.pdf"); xhr.responseType = 'arraybuffer'; ...
CSS3的before, after和label的for用法
04-17 401
使用before和after可以用content, 结合before, after可做写入内容和样式 看例子: [code="html"] Insert title here .before{ width: 100px; height:100px; border: 1px solid blue; } .before::before{ c...
Js动态导入js文件
11-24 248
[code="js"]var plugin = [ "lib/plugin/jquery.lazyload.min.js", "js/common.js", ]; var modules = [ ]; var frame = { //可动态加载css,js文件,支持同步和异步 include: function(file,sync) { //sync判断同步还是异步,...
jquery框架实现基本原理
04-26 244
请看下面代码就明白了 [code="js"]var $ = jquery = function(){ this.AA = 1; return jquery.fn.init(); }; jquery.fn = jquery.prototype = { init: function(){ this.AA = 2; return this; }, ...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值