Title: ひとつの固定ページにだけ ANIMSITION を設定するには
Last modified: 2020年11月12日

---

# ひとつの固定ページにだけ ANIMSITION を設定するには

 *  [kaine8639](https://ja.wordpress.org/support/users/kaine8639/)
 * (@kaine8639)
 * [5年、 11ヶ月前](https://ja.wordpress.org/support/topic/%e3%81%b2%e3%81%a8%e3%81%a4%e3%81%ae%e5%9b%ba%e5%ae%9a%e3%83%9a%e3%83%bc%e3%82%b8%e3%81%ab%e3%81%a0%e3%81%91-animsition-%e3%82%92%e8%a8%ad%e5%ae%9a%e3%81%99%e3%82%8b%e3%81%ab%e3%81%af/)
 * 現在[当該ページ](https://monodukurisearch.com/web_gacha/)にある都道府県名（カテゴリ
   として設定）のテキストリンクをクリックすると、そのカテゴリ内に含まれる記事のうち
   1つがランダムで選ばれ、表示されるプログラムを導入しています。
 * 今回、こうしてランダムで選ばれた記事へ遷移する際に、アニメーションをつけたいと
   考えています。具体的には、この[ANIMSITION](http://git.blivesta.com/animsition/)
   というサービスの中の[ROTATE LARGE](http://git.blivesta.com/animsition/rotate-lg/)
   を適用したく思います。
 * [こちら](https://coliss.com/articles/build-websites/operation/javascript/jquery-plugin-animsition.html)
   のページを参考に試行錯誤しているのですが、今のところまったく動作いたしません。
   行った作業は以下となります。
 * １． テーマエディターのheader.phpに
 *     ```
       <head>
         ...
         <link rel="stylesheet" href="css/animsition.min.css">
   
         <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
         <script src="js/jquery.animsition.min.js"></script>
       </head>
       ```
   
 * を埋め込む。
 * ２． [固定ページ](https://monodukurisearch.com/web_gacha/)下部の都道府県（Table
   で作成）部を、
 *     ```
       <div
         class="animsition"
         data-animsition-in-class="zoom-in"
         data-animsition-in-duration="1000"
         data-animsition-out-class="zoom-out"
         data-animsition-out-duration="800"
       >
         ...
       </div>
       ```
   
 * このdivタグで囲う。
 * ３． 同じ固定ページ内に、HTMLコードのボックスを１つ作り、
 *     ```
       <script>
       $(document).ready(function() {
         $(".animsition").animsition({
           inClass               :   'fade-in',
           outClass              :   'fade-out',
           inDuration            :    1500,
           outDuration           :    800,
           linkElement           :   '.animsition-link', 
           // e.g. linkElement   :   'a:not([target="_blank"]):not([href^=#])'
           touchSupport          :    true, 
           loading               :    true,
           loadingParentElement  :   'body', //animsition wrapper element
           loadingClass          :   'animsition-loading',
           unSupportCss          : [ 'animation-duration',
                                     '-webkit-animation-duration',
                                     '-o-animation-duration'
                                   ]
         });
       }); 
       </script>
       ```
   
 * このタグを埋め込む。
 * 行ったのはこの３ステップです。
 * なんとなく間違えているのはステップの３つ目かなと感じているのですが、自身で判断
   が付きません。恐れ入りますが、誰かわかる方にアドバイスいただけますと幸いです。
    -  このトピックは[kaine8639](https://ja.wordpress.org/support/users/kaine8639/)
      が5年、 11ヶ月前に変更しました。
    -  このトピックは[kaine8639](https://ja.wordpress.org/support/users/kaine8639/)
      が5年、 11ヶ月前に変更しました。
 * ヘルプの必要なページ: _[リンクを見るには[ログイン](https://login.wordpress.org/?redirect_to=https%3A%2F%2Fja.wordpress.org%2Fsupport%2Ftopic%2F%25E3%2581%25B2%25E3%2581%25A8%25E3%2581%25A4%25E3%2581%25AE%25E5%259B%25BA%25E5%25AE%259A%25E3%2583%259A%25E3%2583%25BC%25E3%2582%25B8%25E3%2581%25AB%25E3%2581%25A0%25E3%2581%2591-animsition-%25E3%2582%2592%25E8%25A8%25AD%25E5%25AE%259A%25E3%2581%2599%25E3%2582%258B%25E3%2581%25AB%25E3%2581%25AF%2F%3Foutput_format%3Dmd&locale=ja)]_

 トピック「ひとつの固定ページにだけ ANIMSITION を設定するには」には新たに返信する
ことはできません。

## タグ

 * [ANIMSITION](https://ja.wordpress.org/support/topic-tag/animsition/)
 * [アニメーション](https://ja.wordpress.org/support/topic-tag/%e3%82%a2%e3%83%8b%e3%83%a1%e3%83%bc%e3%82%b7%e3%83%a7%e3%83%b3/)
 * [ランダム](https://ja.wordpress.org/support/topic-tag/%e3%83%a9%e3%83%b3%e3%83%80%e3%83%a0/)
 * [リンク](https://ja.wordpress.org/support/topic-tag/%e3%83%aa%e3%83%b3%e3%82%af/)
 * [WordPress](https://ja.wordpress.org/support/topic-tag/wordpress/)

 * フォーラム: [プラグイン](https://ja.wordpress.org/support/forum/plugins/)
 * 0件の返信
 * 1人の参加者
 * 最後の返信者: [kaine8639](https://ja.wordpress.org/support/users/kaine8639/)
 * 最後の活動: [5年、 11ヶ月前](https://ja.wordpress.org/support/topic/%e3%81%b2%e3%81%a8%e3%81%a4%e3%81%ae%e5%9b%ba%e5%ae%9a%e3%83%9a%e3%83%bc%e3%82%b8%e3%81%ab%e3%81%a0%e3%81%91-animsition-%e3%82%92%e8%a8%ad%e5%ae%9a%e3%81%99%e3%82%8b%e3%81%ab%e3%81%af/)
 * 状態: 未解決

## トピック

### 人気のトピック

### 返信がないトピック

### サポート関連ではないトピック

### 解決済みのトピック

### 未解決のトピック

### すべてのトピック
