指定した数値までカウントアップ「animateNumber」
当ページのリンクには広告が含まれています。
スポンサーリンク
指定した数値までカウントアップをしてくれるプラグイン「animateNumber」を紹介します。
jQueryプラグイン「animateNumber」
このプラグインを使えば、簡単に指定した数値までのカウントアップをWeb上で実現することができます。
例えば、100までのカウントアップを実装した場合、指定した要素が0、1、2、3、... 99、100とカウントアップします。また、カウントアップ完了までの時間も指定できるので、使い方次第ではサイトにおもしろい効果を加えられそうですね。
スポンサーリンク
デモで、100までのカウントアップをご覧ください。
デモのソース（HTML + jQuery）
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<title>animateNumber - jQueryプラグインまとめのカルマ</title>
</head>
<body>
<h1>animateNumberのデモでーす。</h1>
<h2><span id="lines">0</span> %</h2>
<script src="http://code.jquery.com/jquery-2.0.3.min.js"></script>
<script src="jquery.animateNumber.js"></script>
<script>
$('#lines').animateNumber({
number: 100
}, 2000);
</script>
</body>
</html>
jsファイルのダウンロードやその他オプションはこちらからどうぞ。
» animateNumber
スポンサーリンク