[JS]jQueryを使用してインタラクティブなコンテンツを作成するチュートリアル

ツールチップやインフォボックスを使用して、インタラクティブなコンテンツを作成するチュートリアルをBuild Internet!から紹介します。

Making an Interactive Picture with jQuery
demo

デフォルトのインターフェイスは、各ポイントにアイコンが表示されています。

各アイコンにカーソルをあわせるとツールチップが表示され、クリックすると対応したインフォボックスが表示されます。

チュートリアルでは画像の配置から、ボタンの配置、インフォボックスの生成と順を追ってサンプルコードが掲載されています。
また、ファイルも一式でダウンロードすることができます。