2

UI のスタイル シートにクラスを設定し、ユーザーがカラー ピッカーを使用してページのスタイルを設定できる環境設定セクションを用意しました。値は 16 進数としてデータベースに格納されますが、これらの値を使用して jQuery 経由でページを更新すると、次のようになります。

$nav.css("background-color", button_bg_color)

NEW :hover の色を失います。ホバー以外の色は正しく変更されますが、RGB 形式に変換されていることがわかります。これが :hover 値の問題を引き起こしていると推測しています。コードを変更してホバー時にクラスを変更してこれを回避できると思いますが、16 進値を使用して jQuery で色を設定する方法はありますか? それとも、私が見逃しているものがありますか?

更新: :hover 効果を変更できないという点で James Montagne は正しいので、クラスに変更しました。今、 hover() 関数を使用して、私はまだ何かが欠けています: フィドル: http://jsfiddle.net/Y9EBt/6/

4

2 に答える 2

3

ここに問題があります。「Javascript は疑似セレクターの属性の取得または設定をサポートしていません。つまり、:hover css スタイルを直接取得することはできません。」[ソース]

ただし、JQuery には、ホバー項目の css を間接的に変更するためにおそらく使用できる.hover() 関数があります。例: jQuery CSS ホバー

編集: これは私がそれが機能していることを示すフィドルです: http://jsfiddle.net/TvfB9/1/

重要なポイントは次のとおりです。

  • hover_color = "#00FFff";ユーザーの「新しい」または「望ましい」ホバーカラーを保存するために、JavaScriptで(ドキュメント準備機能の外で)グローバル変数を作成しました 。理想的には、ページの読み込み時にスタイルシートにあるものにこれを初期化することをお勧めします。

  • 次に、色変更関数内で、グローバル変数を更新します: hover_color = hover_text_color;. この例では、フィドルで既に使用している変数を割り当てていますが、hover_text_color は、ユーザーがピッカー コントロールから選択した値に置き換える必要があります。

  • ドキュメント対応の JavaScript オブジェクトにホバー機能を追加し、グローバル変数から .nav クラスの CSS を設定しました。

    $('.nav').hover(function() {
        $(this).css('color', hover_color ); 
    },
    function() {
        $(this).css('color', '#ffffff');
    }); 

基本的に、.CSS を使用して CSS を設定すると、実際には CSS がそのクラスに関連付けられている特定のタグの「スタイル」属性に適用され、メモリ内の CSS ファイルなどは変更されません。そのため、ホバー機能を実行するときには、CSS クラスに加えようとした変更はほとんど忘れられています。

怠惰のために、私は前景色のみを変更し、ホバー以外の前景色をハードコーディングしたままにしました。明らかに、あなたはしたくないでしょう;-)

于 2012-09-14T20:08:14.290 に答える
0

:hoverそのようにセレクターとして使用することはできません。セレクターの考え方は、jqueryが現在セレクターに一致するページ上のすべての要素を検索することです。私は、有効なセレクターではないと信じていますが、有効なセレクターである場合は、現在ホバーされている:hoverすべての要素を検索することをお勧めします。これがセレクターの動作方法です。

さらに、要素のスタイルを設定するために使用.cssすると、基本的に要素のスタイル属性に値が追加されます。したがって、スタイル属性でcssを直接設定するhoverことはできないため、を使用して設定することはできません.css

于 2012-09-14T19:39:28.203 に答える