4

ので、私は持っています：

#selection_menu .secondary_options button:hover { color: #000066; }

そして、それは私のサイトでうまく機能します..

ただし、これらのボタンのいずれかがクリックされると、次を含む JavaScript 関数を実行します。

$('button').css("color","#FFFFFF");
if(!$sameTile)
    $($tileSelector).css("color","#000066");

ボタンがクリックされたときに、マウスが離れたときにハイライト色が固定されるようにします。

私が抱えている問題は、これが初めて実行された後、強調表示時にボタンの色が変化しなくなることです。どうすればこれを回避できますか? それともこれは正常な動作ですか？

クラスを追加しようとしていますが、動作させることができません: http://jsfiddle.net/sUKkb/1/

私のコードのいくつか: インデックス: http://pastebin.com/7gYu9YG8 css: http://pastebin.com/Jz1bvzrr

または、これがより役立つかもしれません: http://staging.easyzag.com/style.css

ビューソース:http://staging.easyzag.com/index.php?section=drink

4

4 に答える 4

4

ここでの問題は、jQuery が CSS のルールをオーバーライドするインライン スタイルを追加していることです。もう 1 つの問題は、すべてのボタン$('button').css('color','#000666')にインライン スタイルを適用することです。

次のように、デフォルトとスティッキー状態のルールを CSS に追加することをお勧めします。

button { color:#fff }
button:hover { color:#fff }
.sticky-state { color:#000066 }

次に、あなたのjQueryで、あなたがしていることの代わりにこれを行います:

`$(/*add your selector here*/).addClass('.sticky-state');
于 2012-07-28T03:39:11.500 に答える
1

これは（一般的に）あなたが求めているものだと思います：

jsFiddle: http://jsfiddle.net/sUKkb/5/

HTML:

<button class="not-sticky">Hello</button>

JS:

$('button').on('click', function(e){
    $(this).removeClass('not-sticky').addClass('sticky-state');
});

これには、比較的新しいバージョンの jQuery (1.7+) が必要であることに注意してください。以下を使用することもできます。

$('button').live('click', function(e){
    $(this).removeClass('not-sticky').addClass('sticky-state');
});

また

$('button').click(function(e){
    $(this).removeClass('not-sticky').addClass('sticky-state');
});

古いバージョンの jQuery の場合。

于 2012-07-28T07:59:14.110 に答える
0

これを試して; あなたのCSSで;

.new_class{ 
   color:#000066 
}

あなたのJSで

$('button').css("color","#FFFFFF");
if(!$sameTile){
    $($tileSelector).removeClass()('.your_previous_class');
    $($tileSelector).addClass('.new_class');
}

またはあなたが試すことができます

$($tileSelector).css({ 'color':'#000066' });

ここにフィドルがありますhttp://jsfiddle.net/sUKkb/2/（クラスなし）

そしてこれhttp://jsfiddle.net/sUKkb/3/（クラス付き）

これはhttp://jsfiddle.net/sUKkb/4/クラスの代わりにIDを使用してボタンを一意にします

そして、あなたが望むのは、以下のフィドルのようなトグル ソリューションだと思います。

http://jsfiddle.net/sUKkb/7/

于 2012-07-28T06:40:41.150 に答える
0

問題が発生している場合は、jquery なしで実行できます。

ホバー効果の onmouseover および onmouseout ハンドラーを追加し、最初に onmousover および onmouseout をキャンセルしてから目的の色を設定する onclick を追加します。

于 2012-07-28T06:54:42.680 に答える