ねごとめも背景

ねごとめも

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


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

CSS トランジションタイミング(3次ペジェ) 作成テスト(A)

CSS の transition アニメーションで使用する
CSS トランジションタイミング ?
この値 → transition-timing-function : ***;
下記を javascript に置き直してみました。

三次ペジェの原点を左上で処理していたので、
このプログラムで同じ値を求めようとすると、
x, y を入れ替えたりする必要があったりします。

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);

CSS で出来るものを javascript で作成しても意味が無いような気も。。。

SVG の path 要素の三次ペジェ曲線のデータあれば、
その、データから、トランジションタイミングを作成できるように、
作成してます???(:3冫 ノ)ノ、

実行時間が短い時の処理が特にあやしいです。
イージング関数ってのがあったので、覗いてみたけど、
何をどう計算しているか、さっぱり。。。


2017/09/11 [19:31]

カウンター

プロフィール

negotoy

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

最新記事

カテゴリ

カレンダー

08 | 2017/09 | 10
- - - - - 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
広告: