父标签中 固定 定位的子标签的问题。

父标签中固定定位的子标签的问题。

<div class="be-center wrap" id="ww">
      <i>...</i>
      <i>...</i>
</div>

其中的i标签是固定定位了的，而且是在父元素范围内，现在我想实现的是，移动到父标签范围内 输出1 移出父元素 输出2 ，用父元素的onmouseover,onmouseout

但是有一个问题就是，当移动到i标签时也会 输出2。

阅读 2.7k

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 再在红-绿之间移动，会输出一大堆**

父标签中固定定位的子标签的问题。

**说明：

你尚未登录，登录后可以

js 如何将Key属性相同的放在同一个数组？

vue项目如何在初始化之前跳转外部页面？

js如何控制移动端overflow:scroll容器滑动的最大速度？

前端代码更新如何通知用户刷新页面？

H5页面点击按钮使用window.open 打开并展示一个pdf，安卓变成下载了？

为什么会出现CORS error？

请问一下，如何理解reduce函数呢？

父标签中 固定 定位的子标签的问题。

**说明：

你尚未登录，登录后可以

js 如何将Key属性相同的放在同一个数组？

vue项目如何在初始化之前跳转外部页面？

js如何控制移动端overflow:scroll容器滑动的最大速度？

前端代码更新如何通知用户刷新页面？

H5页面 点击按钮使用window.open 打开并展示一个pdf，安卓变成下载了？

为什么会出现CORS error？

请问一下，如何理解reduce函数呢？

父标签中固定定位的子标签的问题。

H5页面点击按钮使用window.open 打开并展示一个pdf，安卓变成下载了？