自在にスキンをカスタマイズできるJavaScriptのアナログ時計『CoolClock』
September 2, 2008 9:38 AM written by Gen Taguchi
Canvasを使っているのでFirefoxとOperaでしか見られませんが、自在にスキンを変えられるJavaScriptのアナログ時計です。
こうしたスキンが変えられるものは自分で作って配布したり、他の人の作品を使ってみる楽しみがあっていいですね。ブラウザを選ぶので使いどころが難しいですが、覚えておいて損はないかと。
↑ こうした時計が作れます。
swissRail: {
outerBorder: { lineWidth: 1, radius:95, color: "black", alpha: 1 },
smallIndicator: { lineWidth: 2, startAt: 89, endAt: 93, color: "black", alpha: 1 },
largeIndicator: { lineWidth: 4, startAt: 80, endAt: 93, color: "black", alpha: 1 },
hourHand: { lineWidth: 8, startAt: -15, endAt: 50, color: "black", alpha: 1 },
minuteHand: { lineWidth: 7, startAt: -15, endAt: 75, color: "black", alpha: 1 },
secondHand: { lineWidth: 1, startAt: -20, endAt: 85, color: "red", alpha: 1 },
secondDecoration: { lineWidth: 1, startAt: 70, radius: 4, fillColor: "red", color: "red", alpha: 1 }
},
↑ スキンもこうしたコードで記述可能。わかりやすいですな。
詳細＆ダウンロードは以下からどうぞ。
» CoolClock - The Javascript Analog Clock
■ 関連記事
- 立体的に浮かび上がるビジネス名刺『3D Business Card』 | IDEA*IDEA
- え、ただの白いカードが！？覚えておいて損はない『名刺の渡し方』 | POP*POP
- ブログ名刺が届いて大満足！の巻 | IDEA*IDEA
- 世界のクリエイティブな名刺いろいろ | POP*POP
Info: 開発ツール・技術 |
固定リンク |
コメント (0) |
トラックバック (0) |
↑
