Lucky bag::blog: CSS で画像ポップアップ

JavaScript を使わずに、CSS を使ってサムネール画像の拡大画像をマウスオーバーで表示せる方法「CSS ~ Image Pop UP」を参考に、拡大画像をその場で表示させるサンプルを作ってみた。 popup.html 最初に拡大画像を高さ 1px 幅 1px に指定しておき、hover で正寸を指定させることによって実現させている。ちなみに、hover の指定に背景色を指定しないと IE でうまく動作しない。 .photo a.popup:hover { background-color: #fff; } 何となく微妙な感じだけど、サムネールをいっぱい並べて画面遷移なしで拡大画像をみせたい場合に使えるかも。 あの頃のように… - CSS で画像ポップアップさせる (2005年6月10日 19:02) CSS で画像ポップアップ私の中ではかなりの革命です。なぜ今までこれに気が付かな

[hashimoya]

この記事5年前のものかぁ。。それでも普通にさくさく動くのがスゲー

[sihou1]

知らなかった・・　できるんだぁ・・　これだと閲覧者がscriptオフにしてもOK牧場だよなぁ　ちょっとしてみよう

[ilangilang]

簡単そう、に見える。

[webmarksjp]

画像ポップアップ

[samorai]

ＣＳＳテクニック

[kanouk]

かっこいい

[ryouchi]

javascriptを使わずにCSSで画像をポップアップする。

[yoshiii]

JavaScript を使わずに、CSS を使ってサムネール画像の拡大画像をマウスオーバーで表示せる方法

[hxxk]

7-7. CSS を使って画像をポップアップ表示

[oirano]

ポップアップ

[shunuhs]

そのうち使うかも

[const]

例のプルダウンメニューとは別人。重そう。

[memoclip]

ふーん。何かで使うかな…？

[cyblog]

サムネールをいっぱい並べて画面遷移なしで拡大画像をみせたい場合に使えるかも

[zeroset]

こんなことが出来るんだ……

[tetsu_y1]

ポップアップするテクニック

[matsukura]

すげえ！

[hachi]

そんな手があるとは

[Yuny]

……!!　マウスを乗っけると……アクションはJavaScript不要!!　画像拡大に使えると思わなかった。

[koumokumokuten]

使えそう

[paperclip]

うーん、おもしろい

[tarchan]

目からウロコ！

[wacky]

ポップアップではなく画像拡大。普段は縮めておいてマウスオーバーで元のサイズに戻す。

[inaok]

ああ、こういう風になってるのかぁ

[tagosaku]

使える！

[jwj]

なるほどー

[se-mi]

CSSで画像ポップアップ

[matsunaga]

おもしろい

[koyhoge]

alignをいじればポップアップ位置の調整もできるのかな

[alchymia]

試してみる。