画像リンクやテキストリンクにマウスカーソルを合わせたとき、
カクッと右下に少し動くのって見たことありませんか?
例えばこういうやつです。
↓↓↓
これ、動くとなんだかクリックしたくなりませんか?
動かないよりは目に留まりやすいですし、
その分多くの記事を見てくれそうな気がしますよね。
「僕も自分のブログに取り入れたいなー」
と思い、いろいろと探し回っていたのですが、
なかなかうまくいかなかったんですよね。
しかーし、やっとうまくいく方法を探すことができたので、
その方法をあなたに紹介したいと思います。
1分程度でできるので、
サクッとやってみてくださいね^^
設定方法
設定はすごく簡単です。
あなたのブログのHTMLの<head>~</head>の部分、
この部分に以下のタグを入力するだけです。
<style type=”text/css”>
<!–
a:link {
text-decoration:underline;
color:#0033cc;
}
a:visited {
text-decoration:underline;
color:#0033cc;
}
a:active {
text-decoration:underline;
color:#0033cc;
}
a:hover {
text-decoration:underline;
color:#0033cc;
position:relative;top:2px;left:2px;
}
–>
</style>
以上。
リンクの部分が動くようになっているはずです。
</head>の直前に入れるとわかりやすくておススメです。
僕の場合はこれでうまくいきました。
今までうまく出来なかったので、
嬉しくて思わず何回もマウスを乗せてはずしてを繰り返しましたね(笑)
ちなみにワードプレステンプレート【リファイン】をお使いの場合、
をご覧ください。
コメントを残す