航点事件后禁用悬停答案

【问题标题】：Hover Disabled after Waypoint Event航点事件后禁用悬停
【发布时间】：2015-01-28 10:23:50
【问题描述】：

我已经设置了精灵悬停事件和航点 Jquery 事件，它们根据我的主导航菜单上的锚/滚动来更改 css -

jfiddle 示例可以在这里找到：http://jsfiddle.net/LhLpm39p/17/

$('#news').waypoint(function (direction) {
if (direction === 'up') {

    $('#news-menu').css({
        "background-position": "0 0",
            "color": "#fff"
    });


}
}, {
offset: '100%'
}).waypoint(function (direction) {
if (direction === 'down') {

    $('#news-menu').css({
        "background-position": "0 100%",
            "color": "#00a4f0"
    });

}
}, {
offset: '50%'
}).waypoint(function (direction) {
if (direction === 'down') {

    $('#news-menu').css({
        "background-position": "0 0",
            "color": "#fff"
    });

}
}, {
offset: '0%'

});

在您单击任何导航之前，悬停效果很好，但是一旦您单击一个并触发航点，悬停就会被禁用！

请问我该如何纠正这个问题？

【问题讨论】：

标签： jquery css hover nav jquery-waypoints

【解决方案1】：

这可能是 CSS 特定性问题之一。只需用!important 装饰即可。这应该可以解决问题：

.menu:hover {
    background: url("http://www.solidbackgrounds.com/images/two/950x350/950x350-vegas-gold-venetian-red-two-color-background.jpg") 0 100%!important;
color: #00a4f0!important;
}

【讨论】：