一部のソーシャル メディア (Twitter など) へのアイコン付きの href リンクを使用して、カスタマイズされたソーシャル メディア共有リストを作成しようとしています。<ul>リストには、単純な href リンクではない 2 つの「外部」要素も含まれています。
- Facebook の「いいね」ボタンを iFrame として、および
- jsとしてのGoogle +1ボタン
jsfiddle の簡略化された例を参照してください
サイトを整理するために、アイコン (リンク) を 1 行だけ表示し、他のアイコンはラッピング div にカーソルを合わせたときにのみ表示することにしました (ワードプレスのセクシーブックマーク プラグインに似ていますが、厄介なユーザー トラッキングはありません)。
これは、IE8 を除くすべてのブラウザーで正常に動作します (衝撃的なことに... IE7 以前は破棄します):
FB の「いいね」ボタンと「g+1」ボタンの両方は、href リンクにカーソルを合わせると表示されますが、上に移動しようとするとすぐに消えます。これらのボタンをクリックします。
3 つの「アイコン」のみが表示されるようにウィンドウのサイズを変更してみてください。他の 2 つの href 「アイコン」にカーソルを合わせると問題なく動作しますが、「いいね」と「1+」にカーソルを合わせると機能しません。
これは、IE8がリスト要素内のiframeとjsを、ホバーできる有効な要素として認識しないことが問題であると私に信じさせます。どうすれば解決できますか？
IE8 には一般的にホバリングに関する問題があることは承知していますが、この特定の問題に対する解決策を見つけることができませんでした。
どんな助けでも大歓迎です。
ありがとう