Fork
0
Fav
0
View
3572
  • Play

Fullscreen

Smart Phone

  • Readme
  • JavaScript 35 lines
  • HTML 95 lines
  • CSS 0 lines

AnimateNumberのご紹介です。

数字をカウントアップしたり、カウントダウンしたりする場合に利用します。

利用用途が思いつかいな???

そ、そうですね。 例えば、Dashboardの機能などに利用します。

数字ばかり並ぶこともないのですが、最近はアニメーションするグラフのプラグインも 多く見つけます。

そこで、数字のみの表示はあまりにもインパクトがないため、グラフに合わせて アニメーションさせよう!などとおもうわけでございます。

サンプルでは、カウントアップ、カウントダウン、easing利用、callback利用の 4種類があります。

javascriptにコメントはありませんが、セレクタを頼りにコードを見てください。

BLOGの本体は以下です。

Bootstrap jQeuryプラグインサンプル [jQuery AnimateNumber] 指定した数字をカウントアップしたりするプラグイン

以下愚痴です。

  • optionで指定できるものがcompleteに対応できていない。引数で渡しても駄目である。
  • AnimateNumberのサンプルを見る限り、easingはoptionに指定できるが、機能しているか怪しい。
  • option以外の引数に設定した場合は、easingは利用可能である。
  • ソースをみれば、animateをapplyしているので、引数は考えればわかるかも。
  • Bootstrap jQeuryプラグインサンプル [jQuery AnimateNumber] 指定した数字をカウントアップしたりするプラグイン
  • Bootstrap jQeuryプラグインサンプル [jQuery AnimateNumber] 指定した数字をカウントアップしたりするプラグイン

play

Complete!

Description What kind of game?

Control Device

jsdo.it websocket controller

Mouse

keyboard

smartphone

Fullscreen

Shigeru.Ono

Author

ITスクール システムアーキテクチュアナレッジにてjavaの講師をしています。 フロントの技術が好きでjQueryをいじりながら遊んでいます。 たまには開発などして、気ままに過ごしています。

Default Panel

Size

  • Width: px
  • Height: px

code

QR Code

Discussion

Questions on this code?

Tags