ねごとめも背景

ねごとめも

数学、電気の勉強始めました!プログラムにも挑戦しています!|ω・)ノ


作成したプログラムは、こちらでも公開しています。
よかったら覗いてみてください。_( _´ω`)_
→ javascript,SVG で作成したプログラム置き場

CSS アニメーションイージング(cubic-bezier) 作成(B)

前回の記事 → CSS トランジションタイミング(3次ペジェ)

前回の記事でトランジションタイミング?
CSS アニメーションイージング?の
下記を javascript に置き換えたと
書いていましたが、出来ていませんでした。_( _´ω`)_

ease, cubic-bezier(0.25, 0.1, 0.25, 1.0)
linear, cubic-bezier(0.0, 0.0, 1.0, 1.0)
ease-in, cubic-bezier(0.42, 0, 1.0, 1.0)
ease-ou,t cubic-bezier(0, 0, 0.58, 1.0)
ease-in-out, cubic-bezier(0.42, 0, 0.58, 1.0)

横軸 : x 、縦軸 : 時間、のようです。たぶん。。。
前回のは、制御点の x, y 座標で処理していたので、
css の処理と動きを比べると、動きが大きくズレることがありました。
それを、時間に置き換えて処理した所、大体同じ結果を得ることが出来ました。
それでも、座標に 0 より小さい、又は、1 より大きな値を設定すると、
動きがおかしくなったりします。
この辺りも、まだまだ調整、修正が必要のようです。


2017/09/14 [01:26]

コメント

コメントの投稿

カウンター

プロフィール

negotoy

Author:negotoy
電気の勉強始めました!
テキストエディタを使ってプログラミングに挑戦中。fc2 ブログに公開しているテンプレート等は、自由にカスタマイズして、ご活用ください。プログラム実行の前に必ずコードの確認をお願いします。

最新記事

カテゴリ

カレンダー

10 | 2017/11 | 12
- - - 1 2 3 4
5 6 7 8 9 10 11
12 13 14 15 16 17 18
19 20 21 22 23 24 25
26 27 28 29 30 - -


PAGE TOP
広告: