0

関数を使用するときに、たとえば.css()CSS の疑似クラスをオーバーライドするのはなぜでしょうか。:hover要素ではなく、要素の通常の状態にのみ影響するべきではありません:hoverか? または、私は何か間違ったことをしていますか?

これが例です

<!DOCTYPE html>

<html>  
  <head>
    <style>
      #test {
        background : red;
        width: 50px;
        height: 50px;
        opacity : 0.2;
      }

      #test:hover {
        opacity:1.0;
      }
    </style>

    <script type="text/javascript" src="../jquery-1.8.0.min.js"></script>
    <script type="text/javascript">
      $(function () {
        $('#test').css('opacity', '0.5');
      });
    </script>
  </head>

  <body>
    <div id="test"></div>
  </body>
</html>

ページが読み込まopacity = 0.5れると、通常と:hover. 0.5ノーマル用と1.0用じゃないの:hover

私の質問は、これが起こらないようにする方法ですか?

4

2 に答える 2

2

.css()選択した要素にインラインスタイルを適用し、カスケードスタイルの規則に従って、インライン スタイルはスタイルシートのスタイルよりも優先度が高くなります。

次のように、スタイルシート内のクラスをインライン スタイルよりも重要にすることができます。

 #test:hover {
     opacity:1.0 !important;
 }
于 2012-08-31T04:27:47.763 に答える
1

やろうとしていることを行う最善の方法は、不透明度の値を設定するのではなく、代わりに addClass()、removeClass()、または toggleClass() を使用して変更を加えることです。

于 2012-08-31T04:28:30.200 に答える