読者です 読者をやめる 読者になる 読者になる

Panda Noir

JavaScript の限界を究めるブログです。

時計量産機をつくりました

いつもどおりの「かっこいいものをつくってみよう」シリーズです。今回はたくさんのアナログ時計をぐるぐると回します。

サンプル

Clocks 時計が重なるのはしょうがないです。乱数で位置と大きさを指定しているので。若干短針と長針の位置があいませんでした。真ん中のポチでごまかしていますw まあ、はばのある針だったのでしょうがありませんが。

説明

短針と長針をCSS3のtransformで回しています。ただ、transformは中央を指定できないので針を書いた要素を含む親要素を回しています。回る速度は違います。しかし、短針と長針の回りかたは現実の時計と同じです。

終わりに

そのうちいままで作ったものを合わせてみたいです。