コンテンツスライダーとツールチップナビゲーションを実装するチュートリアル

Post on:2010年3月19日

sponsors

ウェブサイトのトップページなどにぴったりなコンテンツスライダーやツールチップナビゲーションなどを実装したページを作成するチュートリアルをAcrisDesignから紹介します。

チュートリアルのポイントはダイナミックなアニメーションでスライドするコンテンツスライダーと補足情報がツールチップ表示されるナビゲーションです。

コンテンツスライダー
スライドは自動と手動の両方に対応。

ツールチップナビゲーション
マウスオーバーで補足情報を表示。

スクリプトのベースにはjQueryが使用されており、プラグインはそれぞれ下記のものが使用されています。

チュートリアルではそれらのHTML/CSS/JavaScriptだけでなく、ヘッダやフッタなどの実装方法も含め、ページ全体の作成方法が解説されています。