0

私はこれを行う方法がなければならないことを知っています。これが私の問題です。コンテナdiv内にあるdivを動的に埋めました。動的に入力されたdivは画像によって伝播され、適切にdisplay: inline順序付けられるように設定されています。私ができないように見えるのは、動的divにオーバーレイを追加することです。コードの概要は次のとおりです。

<div id="container" style="width:800px">
   <div class="dynamic"><a href="#"><img src="" alt="" /></a></div>
   <div class="dynamic"><a href="#"><img src="" alt="" /></a></div>
   <div class="dynamic"><a href="#"><img src="" alt="" /></a></div>
</div>

動的divは背景画像でスタイル設定されており、URLとimgはスクリプトを介して配信されます。私がやりたいのは、それらのdivに適用できるオーバーレイ画像を作成することです。順序付きリストのページ全体に流れる必要があるため、の使用はposition:absolute機能しません。

コードの一部を次に示します：http：//jsfiddle.net/Juccq/

ご覧のとおり、実際には期待どおりに機能していません。それぞれの.dribbble-shotsをきれいに並べてから、.dribbble-shots-overlayにそれぞれpngを適用させたいと思います。コードは1つのインスタンスで機能しますが、乗算されると壊れます。

4

2 に答える 2

0

position:absolute;css プロパティをオーバーレイに追加するだけで、引き続き を使用できますがpointer-events:none;、これは IE または Opera では機能しないことに注意してください。

http://jsfiddle.net/5XqkP/ (CSS も少し修正)

または、代わりに、JavaScript を少し使って次のようなことを試すこともできます。

http://jsfiddle.net/jt8bh/

于 2013-01-10T08:44:05.123 に答える
0

オーバーレイ画像を背景として使用し、:hover でインライン画像の不透明度を 0 に減らすことができます。インライン画像はその位置を保持し、レイアウトを壊しませんが、オーバーレイ (実際には下敷き) 画像は表示されます。

于 2013-01-10T16:34:33.213 に答える