{"id":17141,"date":"2025-09-29T10:00:21","date_gmt":"2025-09-29T01:00:21","guid":{"rendered":"https:\/\/www.welcart.com\/documents\/?post_type=theme-waon&p=17141"},"modified":"2025-12-08T09:53:42","modified_gmt":"2025-12-08T00:53:42","slug":"animation","status":"publish","type":"theme-waon","link":"https:\/\/www.welcart.com\/documents\/archives\/theme-waon\/front\/toppage\/latest-posts\/animation","title":{"rendered":"\u30a2\u30cb\u30e1\u30fc\u30b7\u30e7\u30f3\u8ffd\u52a0"},"content":{"rendered":"\n

Welcart \u548c\u97f3\uff08Waon\uff09\u30c6\u30fc\u30de\u3067\u306f\u3001\u30d6\u30ed\u30c3\u30af\u306b\u8ffd\u52a0 CSS \u30af\u30e9\u30b9<\/strong>\u3092\u6307\u5b9a\u3059\u308b\u3053\u3068\u3067\u3001\u7c21\u5358\u306b\u30d5\u30a7\u30fc\u30c9\u30a4\u30f3\u306a\u3069\u306e\u30a2\u30cb\u30e1\u30fc\u30b7\u30e7\u30f3\u3092\u9069\u7528\u3067\u304d\u307e\u3059\u3002<\/p>\n\n\n\n

\u8ffd\u52a0 CSS \u30af\u30e9\u30b9\u306e\u6307\u5b9a\u65b9\u6cd5\uff08\u30d6\u30ed\u30c3\u30af\u30a8\u30c7\u30a3\u30bf\u64cd\u4f5c\uff09<\/h2>\n\n\n\n
    \n
  1. \u7de8\u96c6\u753b\u9762\u304b\u3089\u30d6\u30ed\u30c3\u30af\u3092\u9078\u629e<\/strong>\u3057\u307e\u3059\uff08\u898b\u51fa\u3057\u30fb\u753b\u50cf\u30fb\u30ab\u30e9\u30e0\u306a\u3069\u3001\u52d5\u304b\u3057\u305f\u3044\u30d6\u30ed\u30c3\u30af\uff09\u3002<\/li>\n\n\n\n
  2. \u53f3\u5074\u306e\u30b5\u30a4\u30c9\u30d0\u30fc\u3067 \uff3b\u30d6\u30ed\u30c3\u30af\uff3d\u30bf\u30d6 \u2192 \u300c\u8a73\u7d30\u8a2d\u5b9a\u300d \u2192 \u300c\u8ffd\u52a0CSS\u30af\u30e9\u30b9\u300d<\/strong> \u3092\u958b\u304d\u307e\u3059\u3002<\/li>\n\n\n\n
  3. \u305d\u3053\u306b\u30a2\u30cb\u30e1\u30fc\u30b7\u30e7\u30f3\u7528\u30af\u30e9\u30b9\u540d\uff08\u4f8b\uff1aanim-reveal<\/code>\uff09\u3092\u5165\u529b\u3057\u307e\u3059\u3002<\/li>\n<\/ol>\n\n\n
    \n
    \"manual-waon-animation\"<\/figure>\n<\/div>\n\n\n

    \u30a2\u30cb\u30e1\u30fc\u30b7\u30e7\u30f3\u4e00\u89a7<\/h2>\n\n\n\n

    \u300c\u8ffd\u52a0 CSS \u30af\u30e9\u30b9\u300d\u306b anim-reveal <\/mark>\u3092\u4ed8\u4e0e\u3057\u305f\u8981\u7d20\u306f\u3001\u30b9\u30af\u30ed\u30fc\u30eb\u30a4\u30f3\u6642\u306b\u30d5\u30a7\u30fc\u30c9\u30a4\u30f3\u3057\u307e\u3059\u3002
    \u3055\u3089\u306b\u3001\u65b9\u5411\u30fb\u901f\u5ea6\u3092\u5236\u5fa1\u3059\u308b\u30b5\u30d6\u30af\u30e9\u30b9\u3092\u7d44\u307f\u5408\u308f\u305b\u308b\u3053\u3068\u3067\u3001\u52d5\u304d\u306e\u30d0\u30ea\u30a8\u30fc\u30b7\u30e7\u30f3\u3092\u8ffd\u52a0\u3067\u304d\u307e\u3059\u3002<\/p>\n\n\n\n

    \u8868\u793a\u65b9\u5411<\/h3>\n\n\n\n
    \u6307\u5b9a\u30af\u30e9\u30b9<\/th>\u52d5\u4f5c\u306e\u8aac\u660e<\/th><\/tr><\/thead>
    anim-reveal<\/td>\u3010\u30c7\u30d5\u30a9\u30eb\u30c8<\/strong>\u3011<\/strong>
    \u6a19\u6e96\u306e\u30d5\u30a7\u30fc\u30c9\u30a4\u30f3\u3002\u9759\u304b\u306b\u73fe\u308c\u307e\u3059\u3002<\/td><\/tr>
    anim-reveal anim-reveal–up<\/td>\u3010\u4e0b\u304b\u3089\u73fe\u308c\u308b<\/strong>\u3011
    \u8981\u7d20\u304c\u4e0b\u304b\u3089\u4e0a\u3078\u6d6e\u304b\u3073\u4e0a\u304c\u308b\u3088\u3046\u306b\u8868\u793a\u3057\u307e\u3059\u3002<\/td><\/tr>
    anim-reveal anim-reveal–down<\/td>\u3010\u4e0a\u304b\u3089\u73fe\u308c\u308b<\/strong>\u3011
    \u8981\u7d20\u304c\u4e0a\u304b\u3089\u4e0b\u3078\u6ed1\u308a\u8fbc\u3080\u3088\u3046\u306b\u8868\u793a\u3057\u307e\u3059\u3002<\/td><\/tr>
    anim-reveal anim-reveal–left<\/td>\u3010\u53f3\u304b\u3089\u73fe\u308c\u308b<\/strong>\u3011<\/strong>
    \u53f3\u5074\u304b\u3089\u5de6\u65b9\u5411\u3078\u30b9\u30e9\u30a4\u30c9\u3057\u306a\u304c\u3089\u30d5\u30a7\u30fc\u30c9\u30a4\u30f3\u3002<\/td><\/tr>
    anim-reveal anim-reveal–right<\/td>\u3010\u5de6\u304b\u3089\u73fe\u308c\u308b<\/strong>\u3011
    \u5de6\u5074\u304b\u3089\u53f3\u65b9\u5411\u3078\u30b9\u30e9\u30a4\u30c9\u3057\u306a\u304c\u3089\u30d5\u30a7\u30fc\u30c9\u30a4\u30f3\u3002<\/td><\/tr><\/tbody><\/table><\/figure>\n\n\n\n

    \u8868\u793a\u901f\u5ea6<\/h3>\n\n\n\n
    \u6307\u5b9a\u30af\u30e9\u30b9<\/th>\u52d5\u4f5c\u306e\u8aac\u660e<\/th><\/tr><\/thead>
    anim-reveal anim-reveal–fast<\/td>\u3010\u65e9\u3081\u306b\u8868\u793a<\/strong><\/strong>\u3011<\/strong>
    \u901a\u5e38\u3088\u308a\u77ed\u3044\u6642\u9593\u3067\u30d5\u30a7\u30fc\u30c9\u30a4\u30f3\u3057\u307e\u3059\u3002<\/td><\/tr>
    anim-reveal anim-reveal–slow<\/td>\u3010\u3086\u3063\u304f\u308a\u8868\u793a<\/strong><\/strong>\u3011
    \u901a\u5e38\u3088\u308a\u9577\u3044\u6642\u9593\u3092\u304b\u3051\u3066\u30d5\u30a7\u30fc\u30c9\u30a4\u30f3\u3057\u307e\u3059\u3002<\/td><\/tr><\/tbody><\/table><\/figure>\n\n\n\n

    \u6a2a\u4e26\u3073\u30ab\u30fc\u30c9\u3092\u9806\u756a\u306b\u8868\u793a\u3057\u305f\u3044\u5834\u5408<\/h3>\n\n\n\n

    \u89aa\u8981\u7d20\u306b reveal-group <\/mark>\u3001\u5b50\u8981\u7d20\u306b anim-reveal <\/mark> \u3092\u6307\u5b9a\u3057\u307e\u3059\u3002
    \u3053\u308c\u306b\u3088\u308a\u3001\u30b9\u30af\u30ed\u30fc\u30eb\u6642\u306b\u30ab\u30fc\u30c9\u304c\u9806\u756a\u306b\u30a2\u30cb\u30e1\u30fc\u30b7\u30e7\u30f3\u8868\u793a<\/strong>\u3055\u308c\u307e\u3059\u3002<\/p>\n\n\n

    \n<div class="reveal-group">\n  <article class="anim-reveal">\u30ab\u30fc\u30c91<\/article>\n  <article class="anim-reveal">\u30ab\u30fc\u30c92<\/article>\n  <article class="anim-reveal">\u30ab\u30fc\u30c93<\/article>\n<\/div>\n<\/pre><\/div>","protected":false},"parent":17086,"menu_order":3,"template":"","class_list":["post-17141","theme-waon","type-theme-waon","status-publish","hentry","wp-sticky"],"acf":[],"_links":{"self":[{"href":"https:\/\/www.welcart.com\/documents\/wp-json\/wp\/v2\/theme-waon\/17141","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.welcart.com\/documents\/wp-json\/wp\/v2\/theme-waon"}],"about":[{"href":"https:\/\/www.welcart.com\/documents\/wp-json\/wp\/v2\/types\/theme-waon"}],"up":[{"embeddable":true,"href":"https:\/\/www.welcart.com\/documents\/wp-json\/wp\/v2\/theme-waon\/17086"}],"wp:attachment":[{"href":"https:\/\/www.welcart.com\/documents\/wp-json\/wp\/v2\/media?parent=17141"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}