前の記事 ≪：キャンバスを使ったお絵かきウィジェットが実装できるjQueryプラグイ...
次の記事 ≫：これは一見の価値ありな、1ページのJSサイト集

画像なしで実現するCSS吹き出しツールチップ実装サンプル色々

2010年05月17日-はてなブックマーク

スポンサード リンク
[PR]　英単語を忘却曲線アプリを使って超効率よく記憶する方法
Filament Group Lab Example From Page from: Image-free CSS Tooltip Pointers - A Use for Polygonal CSS?

画像なしで実現するCSS吹き出しツールチップ実装サンプルの実装チュートリアルが公開されてます。
CSSのみというわけではなくjQuery UI CSS Frameworkを使っていますが、吹き出し部分が画像でない分、左右・中央に自由に吹き出しがつけられます。

画像なしで実現するCSS吹き出しツールチップ fig.1

画像なしで実現するCSS吹き出しツールチップ fig.2
画像なしで実現するCSS吹き出しツールチップ fig.3

バックグラウンドがいい感じに馴染んでますね。

関連エントリ
関連の記事検索：CSS, ツールチップ, Webデザイン
スポンサード リンク

By.KJ : 2010年05月17日 09:08 livedoor Readerで購読 Twitterに投稿

間違いの指摘をしていただける方はメール、あるいはTwitter/FBでお願いします(クリック)