Question

我找到了这个JS小提琴，它正是我正在寻找的。但是，当我将导航移到一边时，我似乎无法弄清楚如何让它工作。

var hoverMenu = $('#HiddenMenu'),
hoverSpace = $('#HoverSpace');
hoverSpace.on('mousemove', function(event) {
if(35 - event.clientY < 0) {
    hoverMenu.css({top: 35 - event.clientY});
} else {
    hoverMenu.css({top: 0});
}
}).on('mouseout', function() {
hoverMenu.css({top: -35});
});

http://jsfiddle.net/PaZHH/1/＆lt; - 这是我想要的clientX / Y事件的工作示例

我似乎无法通过使用clientX＆amp;将导航移到右侧。

这也是我设法得到http://jsfiddle.net/PaZHH/102/

的地方

Answer 1

进行此更改。将绝对定位添加到隐藏菜单：

#HiddenMenu {
    background-color: #e00;
    position: absolute;
    right: -35px;
}

使悬停空间位置相对：

#HoverSpace {
    position: relative;
    background-color: #aeaeae;
    overflow: hidden;
    width: 45px;
    height: 500px;
}

现在，你会没事的。您可以查看结果here。它目前的工作方式是从右侧移动，这与您的水平样本略有不同。

显示取决于鼠标坐标的导航

1 个答案: