小池 夏葉
こんにちは。小池です。本物の美容を提供し結果にコミットしたサービスを提供します。
美容や健康が大好きで、プライベートはヨガに行ったり、お料理をするのが大好きです。
水谷由香
XXXX年生まれ。
ここにプロフィールを入れます。サンプルテキスト。ここにプロフィールを入れます。サンプルテキスト。ここにプロフィールを入れます。サンプルテキスト。ここにプロフィールを入れます。サンプルテキスト。ここにプロフィールを入れます。サンプルテキスト。ここにプロフィールを入れます。サンプルテキスト。ここにプロフィールを入れます。サンプルテキスト。ここにプロフィールを入れます。サンプルテキスト。ここにプロフィールを入れます。サンプルテキスト。
Transformアニメーション加工
※以下の画像のアニメーションは、DL直後では表示されません。
inview.jsというファイルが必要です。ファイルは簡単に入手できます。
※IE10以上で動作します。IE9以下だと挙動がおかしくなる(微妙に動いたり見えなかったりする)ので、一通りリセット(固定表示)しています。リセットスタイルはhead内に入っています。
アニメーションのスタイルは、cssフォルダのinview.cssで調整できます。
自作アニメーションを作って適用する場合、jquery.inview_set.jsへの追加も忘れず行って下さい。
※アニメーションを使わず、通常の固定表示にする場合。
html上部にある、
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
の１行を削除。
続いて、html下部にある、
<!--パララックス用ファイル読み込み-->
<script src="js/jquery.inview.js"></script>
<script src="js/jquery.inview_set.js"></script>
の３行を削除。
続いて、cssフォルダのstyle.css冒頭にある、
/*inview.cssの読み込み*/
@import url(inview.css);
の2行を削除して下さい。
transform1
アニメーションにしたいブロックなどに、class="transform1"とすると、このブロックの動きになります。
XXXX年生まれ。
ここにプロフィールを入れます。サンプルテキスト。ここにプロフィールを入れます。サンプルテキスト。ここにプロフィールを入れます。サンプルテキスト。ここにプロフィールを入れます。サンプルテキスト。ここにプロフィールを入れます。サンプルテキスト。ここにプロフィールを入れます。サンプルテキスト。ここにプロフィールを入れます。サンプルテキスト。ここにプロフィールを入れます。サンプルテキスト。ここにプロフィールを入れます。サンプルテキスト。
transform2
アニメーションにしたいブロックなどに、class="transform2"とすると、このブロックの動きになります。
XXXX年生まれ。
ここにプロフィールを入れます。サンプルテキスト。ここにプロフィールを入れます。サンプルテキスト。ここにプロフィールを入れます。サンプルテキスト。ここにプロフィールを入れます。サンプルテキスト。ここにプロフィールを入れます。サンプルテキスト。ここにプロフィールを入れます。サンプルテキスト。ここにプロフィールを入れます。サンプルテキスト。ここにプロフィールを入れます。サンプルテキスト。ここにプロフィールを入れます。サンプルテキスト。
up
アニメーションにしたいブロックなどに、class="up"とすると、このブロックの動きになります。
XXXX年生まれ。
ここにプロフィールを入れます。サンプルテキスト。ここにプロフィールを入れます。サンプルテキスト。ここにプロフィールを入れます。サンプルテキスト。ここにプロフィールを入れます。サンプルテキスト。ここにプロフィールを入れます。サンプルテキスト。ここにプロフィールを入れます。サンプルテキスト。ここにプロフィールを入れます。サンプルテキスト。ここにプロフィールを入れます。サンプルテキスト。ここにプロフィールを入れます。サンプルテキスト。
left
アニメーションにしたいブロックなどに、class="left"とすると、このブロックの動きになります。
XXXX年生まれ。
ここにプロフィールを入れます。サンプルテキスト。ここにプロフィールを入れます。サンプルテキスト。ここにプロフィールを入れます。サンプルテキスト。ここにプロフィールを入れます。サンプルテキスト。ここにプロフィールを入れます。サンプルテキスト。ここにプロフィールを入れます。サンプルテキスト。ここにプロフィールを入れます。サンプルテキスト。ここにプロフィールを入れます。サンプルテキスト。ここにプロフィールを入れます。サンプルテキスト。
right
アニメーションにしたいブロックなどに、class="right"とすると、このブロックの動きになります。
XXXX年生まれ。
ここにプロフィールを入れます。サンプルテキスト。ここにプロフィールを入れます。サンプルテキスト。ここにプロフィールを入れます。サンプルテキスト。ここにプロフィールを入れます。サンプルテキスト。ここにプロフィールを入れます。サンプルテキスト。ここにプロフィールを入れます。サンプルテキスト。ここにプロフィールを入れます。サンプルテキスト。ここにプロフィールを入れます。サンプルテキスト。ここにプロフィールを入れます。サンプルテキスト。