父标签中 固定 定位的子标签的问题。
<div class="be-center wrap" id="ww"> <i>...</i> <i>...</i></div>
其中的i标签是固定定位了的，而且是在父元素范围内，现在我想实现的是，移动到父标签范围内 输出1 移出父元素 输出2 ，用父元素的onmouseover,onmouseout
但是有一个问题就是，当移动到i标签时也会 输出2
慕丝7291255浏览 823回答 1
1回答
-
慕姐8265434
onmouseover,onmouseout换成onmouseentet,onmouseleave<body> <div class="be-center wrap" id="ww"> <i>A</i> </div> <style type="text/css"> .wrap { position: relative; width: 100px; height: 40px; background-color: #1abc9c; } .wrap i{ position: absolute; width: 20px; height: 20px; left: 30px; top: 10px; color: #fff; background-color: #f55; } </style> <script type="text/javascript"> var wrap = document.getElementsByTagName('div')[0]; wrap.onmouseenter = function() { console.log(1); } wrap.onmouseleave = function() { console.log(2); } </script></body>**说明：一、把鼠标移动到绿色区域，输出1，移出输出2二、把鼠标从【绿色外面】直接移动到红色区域，输出1，注意，这里并不是移动到i输出了1，而是i在div内容，你直接移动到i上就等于移动到了div上。三、鼠标在绿色区域的时候，不停在红色-绿色之间移动，什么都不会输出，这证明移动到i上什么都没输出...还不信自己换成mouseover和mouseout 再在红-绿之间移动，会输出一大堆**
随时随地看视频慕课网APP
相关分类
JavaScript