Category web.

http://cho45.stfuawsc.com/misc/css3-sine-wave.html

CSS 自体では自由な曲線は描くことができないが、CSS animation では、animation-timing-function で cubic-bezier() を使い定義したベジェ曲線に従ってプロパティーの変化量を決めることができる。

なので、複数の animation する要素を組合せることで、全体としてサイン波を描くことができる。

ポイントは animation-timing-function はキーフレーム間 (1回のアニメーション全体ではない) に適用される点で、勘違いしているとひたすらハマる。


上記の例ではアニメーションさせたままだが、animation-delay に負の値を指定して animation-play-state: paused; を指定すれば止めた状態にもできる。

http://cho45.stfuawsc.com/misc/css3-sine-wave2.html

  1. トップ
  2. web
  3. CSS Animation Sine Wave

section

この日記みたいな URL で blosxom のエントリにアクセスできるようにするプラグインです。

例えば blosxom デフォルトだと /2006/09/09/ までしか時間単位で特定できないですが、このプラグインで /2006/09/09/1 とかという風に完全に時間ベースで一つのエントリを特定できるようになります。

特定の環境でしかテストしてないのでいろいろ不具合があるかも。extensionless とは共存できるみたいです。

  1. トップ
  2. blosxom
  3. blosxom section plugin
  1. トップ
  2. web
  3. blosxom section plugin
  1. トップ
  2. prog
  3. blosxom section plugin