javascript - 跟随光标鼠标的侧边栏隐藏/显示按钮？

Question

我在 HTML 上有一个侧边栏，它有一个打开和关闭侧边栏的按钮.. 像这样：（栏是一个 div）

    | |open> <--- this is the button
    | |
    | |
    | |
    | |

    on click:
    - Menu 1 | |close> 
    - Menu 2 | |
    - Menu 3 | |
    - Menu 4 | |

我想要的是，如果我将鼠标移到栏上，打开/关闭按钮也会随之移动，但我不知道该怎么做。

Answer 1

如果您可以提供一些源 html 和 css，我可以为您提供更具体的答案，但是使用类似于我下面示例的 CSS 和 JQUERY 应该会给您想要的效果...

该过程正在使用 jquery 侦听 mousemove 事件并将鼠标的 Y 位置存储在 js 变量中。然后我们正在调整 '.button 的 CSS 以匹配该值。

具体来说，此方法将依赖于您的按钮具有绝对位置，并为 TOP 声明值。

HTML

<div class="button"></div>

JS

var posY;

$(document).mousemove( function(e) { 
   posY = e.pageY;
    $('.button').css({'top': posY});
});  

CSS

.button {
    top:0px;
    position:absolute;
    /* ... */
}

您可以在这里找到所有内容，按钮垂直移动以跟随鼠标