0
var navObject = {
padLeft : '20px',
padLeftHover : '40px',
goRight : function(obj){
    if (!obj.parent('li').hasClass('active')) {
        obj.stop(true, true).animate({ 'padding-left' : this.padLeftHover }, 'fast');
    }
},
goLeft : function(obj){
    if (!obj.parent('li').hasClass('active')) {
            obj.stop(true, true).animate({ 'padding-left' : this.padLeft }, 'fast');
    }
},
makeActive : function(obj) {
    obj.siblings().each(function() {
        if($(this).hasClass('active')) {
            $(this).removeClass('active');
            navObject.goLeft($(this).children('a'));
        }
    });
    if (!obj.hasClass('active')) { 
        obj.addClass('active');
    }
}

}$(function() {
$('#navigation li a').hover(function() {
    navObject.goRight($(this));
    $(this).css({
    "color": "red", 
    "position": "relative",
    "font-size": "20px"});
}, function() {
    navObject.goLeft($(this));
    $(this).css({
    "color": "yellow",
    "font-size": "14px"});
});

$('#navigation li a').click(function() {
    navObject.makeActive($(this).parent('li'));
    navObject.goRight($(this));
    return false;
});});

こんにちは..私はこのjqueryコードを持っています。私がここでやっているのは、ウェブサイトの垂直ナビゲーションバーです

私の問題は、ナビゲーションメニューにカーソルを合わせると、コード内のすべての CSS が実行されることです。しかし、メニューをクリックすると、テキストが赤のままになります。黄色に戻らない..

私を助けてくれてありがとう.. ^_^

4

1 に答える 1