Jquery颜色选择器悬停元素



需要帮助的悬停类。

正如你可以看到的代码,然后我必须悬停元素,但不幸的是,他们不改变颜色。你有什么好主意吗?

我遵循了代码:

$('#color_mix_menu_top').ColorPicker({
    color: '#0000ff',
    onShow: function (colpkr) {
        $(colpkr).fadeIn(500);
        return false;
    },
    onHide: function (colpkr) {
        $(colpkr).fadeOut(500);
        return false;
    },
    onChange: function (hsb, hex, rgb) {
        $('#menu > ul > li:hover > a, #menu > ul > li > a:hover, #menu > ul > li > div').css('backgroundColor', '#' + hex);
        $('#color_mix_menu_top').css('backgroundColor', '#' + hex);
}
});

您是否已记录或调试以验证您的jquery选择器是否正常工作?如

console.log("" + $('#menu > ul > li:hover > a, #menu > ul > li > a:hover, #menu > ul > li > div').length)

只是为了确保你没有错过什么

那么一个简单的解决方案:

$('#menu > ul > li > a, #menu > ul > li > div').data('bg', '#' + hex);
然后

$('#menu > ul > li > a').hover(function(){
     $(this).css('background', $(this).data('bg'));
}, function(){
     void(0);
})

如果你想重置mouseout的颜色:

var currBG;
$('#menu > ul > li > a').hover(function(){
    currBG = $(this).css('background');
    $(this).css('background', $(this).data('bg'));
}, function(){
    $(this).css('background', currBG);
})

你可以根据你的需要稍微调整一下

最新更新