LoginSignup
6
6

More than 5 years have passed since last update.

IE7・8で、後から追加生成したDOMにcss擬似クラス :hover がちゃんと当たらない問題の対策

Posted at

何を言っているのか


                            レガシーIE対策をする前に言っておくッ!
                    おれは今やつのバグ(?)をほんのちょっぴりだが体験した
                  い…いや…体験したというよりはまったく理解を超えていたのだが……
         ,. -‐'''''""¨¨¨ヽ
         (.___,,,... -ァァフ|          あ…ありのまま 今 起こった事を話すぜ!
          |i i|    }! }} //|
         |l、{   j} /,,ィ//|       『DOMを後から追加したら
        i|:!ヾ、_ノ/ u {:}//ヘ        CSSの:hoverが効かなかった』
        |リ u' }  ,ノ _,!V,ハ |
       /´fト、_{ル{,ィ'eラ , タ人        な… 何を言ってるのか わからねーと思うが
     /'   ヾ|宀| {´,)⌒`/ |<ヽトiゝ        おれも何をされたのかわからなかった…
    ,゙  / )ヽ iLレ  u' | | ヾlトハ〉
     |/_/  ハ !ニ⊇ '/:}  V:::::ヽ        頭がどうにかなりそうだった…
    // 二二二7'T'' /u' __ /:::::::/`ヽ
   /'´r -―一ァ‐゙T´ '"´ /::::/-‐  \    Javascriptのイベントの割付ミスとか
   / //   广¨´  /'   /:::::/´ ̄`ヽ ⌒ヽ    そんなチャチなもんじゃあ 断じてねえ
  ノ ' /  ノ:::::`ー-、___/::::://       ヽ  }
_/`丶 /:::::::::::::::::::::::::: ̄`ー-{:::...       イ  もっと恐ろしいものの片鱗を味わったぜ…

いやホントもう何なんですかね、よく分かんなかったんですけども
後から生成して追加したDOM要素には:hoverのスタイルだけちゃんと当たらないのです。
擬似クラス全般なのかどうかは確かめてません。

解決策

$(function(){

  // 何らかの処理...

  // 最後にコレ
    $('link').each(function(){
        $(this).attr('href',$(this).attr('href'));
    });
});

やってることはonreadyの最後にCSSを読みなおししてるだけです。
この処理し終わった後にJSでDOMの生成・追加をしてもCSSの擬似クラスが当たらない問題は解決するのですが、なんでコレで直るのやら・・・理由がよくわかりません。

取り敢えず何とかなったからなんとかしてしまったというかんじです。なんでコレで大丈夫なのか誰か教えてください・・・。(;´Д`)

6
6
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
6
6