CSSだけでイメージマップを作る有用サンプル:phpspot開発日誌

CSS Image Maps - Flickr-like Technique? Below is a sample image map that's built entirely using CSS and XHTML. CSSだけでイメージマップを作る有用サンプル。 画像の特定部分にカーソルを合わせると、説明を画像上に表示できるCSSとXHTMLサンプルが公開されていました。 JavaScript を一切使っておらず、CSSだけで実現されているところがすごいですね。 JavaScript が要らず、次のような綺麗なHTMLで実現できるところも嬉しいですね。 実装も簡単そうです。 <dl id="officeMap"> <dt id="monitor">1. Monitor</dt> <dd id="monitorDef"><a href="#"><span>Here's my 17" M

[kiyokichi]

areaを使用しないonmouseイベント

[webmarksjp]

*css

[hoshikuzu]

へぇ。

[usj12262]

ダイアログ画面の各項目にポインタを合わせると説明を表示したりできる

[bigwest]

CSSのみでイメージマップ

[ag-commerce]

画像の特定部分にカーソルを合わせると、説明を画像上に表示できるCSSとXHTMLサンプルが公開されていました。

[lesamoureuses]

javascriptを使わずに実現

[saladdays]

クリッカブルマップをCSSで。

[yoshiii]

「JavaScript が要らず、次のような綺麗なHTMLで実現できるところも嬉しいですね。実装も簡単そうです。」http://www.frankmanno.com/ideas/css-imagemap/

[spicychicken]

どこが綺麗なHTMLなのか理解できない

[sippu]

これは便利だ。覚えておこう。

[Yuny]

CSSだけでイメージマップ。きちんと組めば使いよう大。

[You-2u]

イメージマップ

[bonnaroo]

つかえそう

[oromaggie]

position:absolute はこういう時こそ有効活用すべき

[adamrocker]

なんとCSSだけでイメージマップが作れてしまうそうです。まだ詳しく中を見ていませんが、どうやってレイアウトを操作しているのでしょうか。地道に数値合わせぐらいしか方法が浮かびませんが…

[tofu-kun]

これは便利そう