今日の人気記事

  1. 国際電話の入力フォーム「International Telephone Input」

指定した要素をアニメ効果でハイライト「Highlighter」

当ページのリンクには広告が含まれています。

スポンサーリンク

指定した要素をアニメ効果でハイライトするプラグイン「Highlighter」を紹介します。

jQueryプラグイン「Highlighter」

このプラグインを使えば、指定した要素「テキスト」「フォーム」「テーブル」などなど!なんでもアニメ効果でハイライトすることができます。サイト内で注目させたい要素を際だたせることができます。

デフォルトでは、指定した要素にアニメーションでふわっと色付きの影が表示されます。

スポンサーリンク

デモでは、ページロード時に指定したテキスト(span)がふわっとハイライトされます。

「Highlighter」のデモ

デモのソース(HTML + jQuery)

<!DOCTYPE html>
<html>
<head>
<meta charset='utf-8'>
<meta name="description" content="Highlighterのデモでーす。">
<title>Highlighter - jQuery Plugin Demo</title>
<script src="//code.jquery.com/jquery-1.9.1.min.js"></script>
<script src="jquery.highlighter.js"></script>
<script type="text/javascript">
$(function(){
  $("span").highlight();
});
</script>
</head>
<body>
<h1>Highlighterのデモでーす。</h1>
<p>指定した要素を<span>ハイライト</span>しますよ。</p>
</div>
</body>
</html>
スポンサーリンク

関連記事(一部広告含む)