{"id":6789,"date":"2024-12-14T10:31:37","date_gmt":"2024-12-14T01:31:37","guid":{"rendered":"https:\/\/taitan916.info\/blog\/?p=6789"},"modified":"2024-09-29T11:22:56","modified_gmt":"2024-09-29T02:22:56","slug":"post-6789","status":"publish","type":"post","link":"https:\/\/taitan916.info\/blog\/archives\/6789","title":{"rendered":"JavaScript\u306b\u3066\u6570\u5024\u306e\u30ab\u30a6\u30f3\u30c8\u30a2\u30c3\u30d7\u53ca\u3073\u30ab\u30a6\u30f3\u30c8\u30c0\u30a6\u30f3\u3092\u8868\u793a\u3059\u308b\u300ccountUp.js\u300d\u30e9\u30a4\u30d6\u30e9\u30ea\u306e\u5229\u7528\u65b9\u6cd5"},"content":{"rendered":"

\u3060\u3044\u3076\u524d\u306b\u30d0\u30cb\u30e9JS\u306b\u3066\u6570\u5024\u306e\u30ab\u30a6\u30f3\u30c8\u30a2\u30c3\u30d7\u53ca\u3073\u30ab\u30a6\u30f3\u30c8\u30c0\u30a6\u30f3\u8868\u793a\u3092\u884c\u3046\u65b9\u6cd5<\/a>\u3092\u30e1\u30e2\u3057\u305f\u304c\u3001\u3082\u3063\u3068\u6ed1\u3089\u304b\u306b\u30ab\u30a6\u30f3\u30c8\u30a2\u30c3\u30d7\u53ca\u3073\u30c0\u30a6\u30f3\u3055\u305b\u3066\u307b\u3057\u3044\u3068\u8981\u671b\u3092\u53d7\u3051\u305f(\u524d\u306e\u65b9\u6cd5\u3060\u3068\u30ab\u30af\u3064\u304f)\u3002\u8abf\u3079\u305f\u3068\u3053\u308d\u300ccountUp.js\u300d\u30e9\u30a4\u30d6\u30e9\u30ea\u3060\u3068\u6ed1\u3089\u304b\u4e14\u3064\u5c0e\u5165\u3082\u7c21\u5358\u305d\u3046\u3002\u4ee5\u4e0b\u306b\u5b9f\u88c5\u65b9\u6cd5\u3092\u30e1\u30e2\u3002<\/p>\n

 <\/p>\n

\u30b5\u30f3\u30d7\u30eb<\/h2>\n

https:\/\/taitan916.info\/sample\/countUp.js\/<\/a><\/p>\n

 <\/p>\n

countUp.js<\/h2>\n

\u516c\u5f0f\u30b5\u30a4\u30c8<\/h3>\n

https:\/\/inorganik.github.io\/countUp.js\/<\/a><\/p>\n

GitHub<\/h3>\n

https:\/\/github.com\/inorganik\/CountUp.js<\/a><\/p>\n

CDN<\/h3>\n

CDN\u3067\u4f7f\u3046\u5834\u5408\u306f\u4ee5\u4e0b\u3092\u8a18\u8ff0\u3059\u308b\u3002<\/p>\n

<script src=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/countup.js\/2.0.5\/countUp.umd.min.js\"><\/script><\/pre>\n
\u7570\u306a\u308b\u30d0\u30fc\u30b8\u30e7\u30f3\u3092\u5229\u7528\u3057\u305f\u3044\u5834\u5408\u306f\u4ee5\u4e0b\u304b\u3089\u63a2\u3059\u3002<\/p>\n
https:\/\/cdnjs.com\/libraries\/countup.js\/2.0.5<\/a><\/p>\n
 <\/p>\n
\u5b9f\u88c5\u65b9\u6cd5<\/h2>\n
\u30bd\u30fc\u30b9\u30b3\u30fc\u30c9<\/h3>\n
<main>\r\n    <section>\r\n        <b>1\u304b\u308910,000\u307e\u3067\u30ab\u30a6\u30f3\u30c8\u30a2\u30c3\u30d7<\/b>\r\n        <div id=\"count_up\"><\/div>\r\n    <\/section><hr>\r\n    <section>\r\n        <b>10,000\u304b\u30891\u307e\u3067\u30ab\u30a6\u30f3\u30c8\u30c0\u30a6\u30f3<\/b>\r\n        <div id=\"count_down\"><\/div>\r\n    <\/section>\r\n<\/main>\r\n\r\n<script src=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/countup.js\/2.0.5\/countUp.umd.min.js\"><\/script>\r\n<script>\r\n\/\/\u30ab\u30a6\u30f3\u30c8\u30a2\u30c3\u30d7\r\nconst count_up_options = {\r\n    duration: 1,\r\n}\r\nconst count_up = new countUp.CountUp(`count_up`, 10000, count_up_options);\r\ncount_up.start();\r\n\r\n\/\/\u30ab\u30a6\u30f3\u30c8\u30c0\u30a6\u30f3\r\nconst count_down_options = {\r\n    startVal: 10000,\r\n    duration: 1,\r\n}\r\nconst count_down = new countUp.CountUp(`count_down`, 1, count_down_options);\r\ncount_down.start();\r\n<\/script><\/pre>\n
\u30aa\u30d7\u30b7\u30e7\u30f3\u306b\u3064\u3044\u3066<\/h3>\n
\u30aa\u30d7\u30b7\u30e7\u30f3\u306b\u3064\u3044\u3066\u306f\u516c\u5f0f\u30da\u30fc\u30b8<\/a>\u3067\u8272\u3005\u30d1\u30e9\u30e1\u30fc\u30bf\u3092\u7de8\u96c6\u3057\u300cApply\u300d\u30dc\u30bf\u30f3\u3092\u30af\u30ea\u30c3\u30af\u3059\u308b\u3068\u30bd\u30fc\u30b9\u30b3\u30fc\u30c9\u304c\u8868\u793a\u3055\u308c\u308b\u306e\u3067\u3001\u305d\u3061\u3089\u3092\u30b3\u30d4\u30da\u3059\u308b\u3068\u826f\u3044\u3002<\/p>\n","protected":false},"excerpt":{"rendered":"
\u3060\u3044\u3076\u524d\u306b\u30d0\u30cb\u30e9JS\u306b\u3066\u6570\u5024\u306e\u30ab\u30a6\u30f3\u30c8\u30a2\u30c3\u30d7\u53ca\u3073\u30ab\u30a6\u30f3\u30c8\u30c0\u30a6\u30f3\u8868\u793a\u3092\u884c\u3046\u65b9\u6cd5\u3092\u30e1 ... <\/p>\n","protected":false},"author":1,"featured_media":1067,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"footnotes":""},"categories":[4],"tags":[100],"class_list":["post-6789","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-javascript","tag-library"],"acf":[],"aioseo_notices":[],"_links":{"self":[{"href":"https:\/\/taitan916.info\/blog\/wp-json\/wp\/v2\/posts\/6789","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/taitan916.info\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/taitan916.info\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/taitan916.info\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/taitan916.info\/blog\/wp-json\/wp\/v2\/comments?post=6789"}],"version-history":[{"count":3,"href":"https:\/\/taitan916.info\/blog\/wp-json\/wp\/v2\/posts\/6789\/revisions"}],"predecessor-version":[{"id":6792,"href":"https:\/\/taitan916.info\/blog\/wp-json\/wp\/v2\/posts\/6789\/revisions\/6792"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/taitan916.info\/blog\/wp-json\/wp\/v2\/media\/1067"}],"wp:attachment":[{"href":"https:\/\/taitan916.info\/blog\/wp-json\/wp\/v2\/media?parent=6789"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/taitan916.info\/blog\/wp-json\/wp\/v2\/categories?post=6789"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/taitan916.info\/blog\/wp-json\/wp\/v2\/tags?post=6789"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}