Home > スポンサー広告 > Shadowbox応用:複数のWebページをグループ化してまとめる


スポンサーサイト

上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。

 Comments:-

Comment Form

 Trackback+Pingback:-

TrackBack URL for this entry
http://blackcat13numbers.blog31.fc2.com/tb.php/199-56a41098
Listed below are links to weblogs that reference
スポンサーサイト from TRASH

Home > スポンサー広告 > Shadowbox応用:複数のWebページをグループ化してまとめる

Home > IT Tips > Shadowbox応用:複数のWebページをグループ化してまとめる


Shadowbox応用:複数のWebページをグループ化してまとめる

以下の記事で実装方法やサンプルを掲載しました。
●Shadowbox実装手順

今回は、このShadowboxを使った応用として、複数のWebページをグループ化してまとめる手法を紹介したいと思います。ページをグループ化することで、拡大した画像の下に「Close」だけではなく、「Previous」と「Next」リンクを付けてページ遷移を容易にし、ユーザビリティを向上させることもできます。

サンプル(テキストリンク)とコードは以下の通りです。
Google
Yahoo! JAPAN
MSN Japan
<a href="http://www.google.co.jp/" rel="shadowbox[hogehoge]" title="Google">Google</a>
<a href="http://www.yahoo.co.jp/" rel="shadowbox[hogehoge]" title="Yahoo! JAPAN">Yahoo! JAPAN</a>
<a href="http://jp.msn.com/" rel="shadowbox[hogehoge]" title="MSN Japan">MSN Japan</a>
※[]内のhogehogeは任意ですが、グループ化するには同じ文字を入力ください

次にサンプル(画像リンク)とコードはテキスト同様、以下の通りです。
Google
20080516_1.png
Yahoo! JAPAN
20080516_2.png
MSN Japan
20080516_3.png
Google
<a href="http://www.google.co.jp/" rel="shadowbox[hogehoge]"><img src="http://blog-imgs-29.fc2.com/b/l/a/blackcat13numbers/20080516_1s.png" alt="20080516_1.png" border="0" align="left"/></a><br clear="all" />Yahoo! JAPAN
<a href="http://www.yahoo.co.jp/" rel="shadowbox[hogehoge]"><img src="http://blog-imgs-29.fc2.com/b/l/a/blackcat13numbers/20080516_2s.png" alt="20080516_2.png" border="0" align="left"/></a><br clear="all" />MSN Japan
<a href="http://jp.msn.com/" rel="shadowbox[hogehoge]"><img src="http://blog-imgs-29.fc2.com/b/l/a/blackcat13numbers/20080516_3s.png" alt="20080516_3.png" border="0" align="left"/></a><br clear="all" />
今回はWebページに絞りましたが、次回はFlashやYouTubeなどの動画をオーバーレイさせる方法を紹介したいと思います。
スポンサーサイト

 Comments:0

Comment Form

 Trackback+Pingback:0

TrackBack URL for this entry
http://blackcat13numbers.blog31.fc2.com/tb.php/199-56a41098
Listed below are links to weblogs that reference
Shadowbox応用:複数のWebページをグループ化してまとめる from TRASH

Home > IT Tips > Shadowbox応用:複数のWebページをグループ化してまとめる

Recent Comments
Recent Trackback
Feeds

↑Page Top

上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。