Question

我正在使用颜色选择器来更改某些元素

function(color) {  
    $("#post h1").css("color",color.toHexString());
    $("#footer").css("background",color.toHexString());
    $("#navigation a:hover").css("background",color.toHexString());             
}

#post h1和#foooter工作正常，但如何更改#navigation a:hover？

Answer 1

更新：试试吧：

$('#navigation').hover(function(){
    $(this).css({'color':'your_color_when_mouse_in'});
},  function(){
    $(this).css({'color':'your_color_when_mouse_out'});
} );

Answer 2

时髦的新鲜替代品！

function(color){
    //creates a new style tag
    var style = document.createElement('style');
    style.type = 'text/css';
    //setup your items as actually css instead of style attributes
    vars css = '#post h1{color: '+color.toHexString()+'}';
    css += '#footer, #navigation a:hover{background: '+color.toHexString()+'}';
    //place said css into style tag
    style.styleSheet.cssText = css;
    //add style tag to document
    $('head').append(style);
}

这会在您的文档中添加一个新的<style>标记，其中包含您想要的css。此外，它还允许您使用css native :hover！

如何使用jquery css a：悬停

2 个答案: