javascript - 位置:前景に対する相対移動イメージ

Question

サイトに Comodo トラストロゴを実装しようとしています。マウスオーバーすると、iframe がポップアップし、サイトに関するセキュリティ情報が表示される画像です。これを行うコードはサードパーティから提供されています。

問題は、ロゴが相対的に配置された画像の近くにある場合に発生します。画像は iframe の上に表示されます。フッター画像から削除するposition:relative;と、iframe が画像の上に表示されます。ただし、ページの残りの部分の外観が乱れるため、相対位置を削除することはできません。

問題を jsFiddle HEREにまとめました。

score 3 · Accepted Answer

トラストロゴは、 a を 0 に設定しdivてページに挿入するz-indexため、基本的に他のすべて (画像を含む) の背後に配置されます。

z-indexを他の正の整数に変更すると、のスタック順序が変更され、画像の上に配置されます (明示的に設定されていない限り、iframe画像のより高い場合に限ります)。z-index

これをスタイルシートに追加するとうまくいくはずです (ロゴが常にdiv同じ ID のを生成すると仮定します):

#tl_popupSC5{
    z-index:1 !important;        
}

divフレームを含むにはz-indexインラインスタイルを介したセットがあるため、適切にオーバーライドされていることを確認する必要があることに注意してください。

score 1 · Accepted Answer

z-indexcss プロパティを使用します。

#baselineImage
{
    height:10px;
    width:100%;
    position:relative;
    top:-6;
    z-index:-1;
}

2 に答える 2