S-Likeの使い方
-
S-Likeの読み込み
下記どちらかの方法で、</body>の直前にS-Likeを読み込みます。
-
専用class名の記述
使いたいモーションの、専用class名を対象の要素（HTMLタグ）に記述します。
-
専用JSコードの記述
使いたいモーションの、専用JSコードを<script>内に記述します。
S−Likeの読み込み方法
S-Like：Ver.β
最終更新日：2022.3.30
S-Likeサーバーから直接読み込む
<script src="https://s-like.com/beta/s-like.min.js"></script>ダウンロードしたファイルを読み込む
各モーションの
詳しい設定方法
インビュー
指定した要素が画面に入ったタイミングで、様々なモーションによって出現させる関数。
パララックス
指定した要素に、スクロールに連動する様々な視差効果（パララックス）モーションを実装できる関数。
テキストモーション
指定したテキスト要素に設定した様々なパターンのモーションを、１文字ずつ個別に発動させる関数。
ブラインド
指定した要素の出現時に、様々なパターンのブラインドモーションを発動させる関数。
スクロール連動
指定した要素に、画面のスクロールに連動する様々なモーションを実装できる関数。
タップアクション
指定した要素をタップ（クリック）したときに、様々なパターンのモーションを発動させる関数。
ポップアップ
指定した要素をタップ（クリック）すると、ポップアップウィンドウが表示される仕組みを実装できる関数。
メニュー
メニュー項目とURLを記述したJSONファイルから、簡単にメニュー（ナビゲーション）が実装できる関数。
アコーディオン
タップ（クリック）の度に、開閉（表示と非表示）を切り替えられるアコーディオンを実装できる関数。
カーソル連動
指定した要素に、マウスカーソルの動きに連動する様々なモーションを実装できる関数。（※PCのみ対応）
ローディング
ページのローディング中に発動する、ローディング画面やアニメーションを実装できる関数。
アドクラス
指定した要素に、特定の条件下でclassを付与／剥奪することにより様々なモーションを実装できる関数。
CSSアニメーション
JSに依存しない、CSSのみで実装された様々なアニメーションを設定できるclass。