Bootstrapのpopoverの吹出しなど、動的コンテンツのスタイルがおかしくなって困ったときのデバッグ方法。
普段はFirebugを使っているが、ここではChromeでの方法を。
- デバッグしたいポップオーバーをコンテキストメニューから「要素の検証」により表示。 ディベロッパーツールが同時に立ち上がる。
- もう一度トリガー箇所にマウスを当て、ポップオーバーを表示。
-
Command+Tab等でChrome以外の別ウィンドウにフォーカスを当てる。 - その状態ならポップオーバーを開いた状態でマウスが移動可能になるので、ディベロッパーウィンドウで動的コンテンツ(div class="popover"のやつ)のスタイルの調査が出来る。