「あれこれポップアップ」を導入

  • 投稿日:
  • by

すでにこのブログに導入していますが、
改めて「あれこれポップアップ」を紹介します。

簡単にいうと、リンク等にマウスカーソルを持っていくと、
クールなポップアップが出るというものです。

こんな感じです。


導入方法は至って簡単です。

まずは↓から、必要なJavaScriptとCSSのセットをダウンロードします。

「あれこれポップアップ」


ダウンロードして、解凍すると、

ArekorePopupというフォルダに、

・ArekorePopup.css
・ArekorePopup.js


という二つのファイルができます。

そのファイルをMovableTypeのスタティックフォルダに、フォルダごとアップロードします。


そしてテンプレートの<head>~</head>の間に、


<link href="<$MTStaticWebPath$>ArekorePopup/ArekorePopup.css" rel="stylesheet" type="text/css">
<script src="<$MTStaticWebPath$>ArekorePopup/ArekorePopup.js" type="text/javascript"></script>


を挿入します。


リビルド終了後、上記の図のようにポップアップが出てくるかと思います。

デフォルトでは、アンカータグに「title」属性が付いているものがポップアップとして表示されます

例:

<a href="http://********/index.html" title="クリックしてね!">リンク</a>


という感じにします。


どしどし「title属性」を付けていきましょう(笑)