11–20 of 43 posts
Sadly you'd need some JS to set them to the right time though, which rather ruins the beauty of it. I think. If anyone knows a way to do it without JS I'd love to hear how.
I noticed when it updates the second hand (this is present on most clocks). The hand moves and appears very blocking for several frames until anti-aliasing kicks in.
Is this a web browser issue?
(FF27, windows 7 x86_64).
Very nice indeed. Technically you should be able to do the same thing in CSS... I knocked this together in 20 minutes as a proof of concept: http://codepen.io/onion2k/details/kmouK Sadly you'd need some JS to set them to the right time though, which rather ruins the beauty of it. I think. If anyone knows a way to do it without JS I'd love to hear how.
Very nice indeed. Technically you should be able to do the same thing in CSS... I knocked this together in 20 minutes as a proof of concept: http://codepen.io/onion2k/details/kmouK Sadly you'd need some JS to set them to the right time though, which rather ruins the beauty of it. I think. If anyone knows a way to do it without JS I'd love to hear how.
yeah you'll need some code to animate the handles.
The only non-JS solution is to tell people to only load the page at exactly 12:00:00, but that's a bit impractical.
Nicely Done. I noticed when it updates the second hand (this is present on most clocks). The hand moves and appears very blocking for several frames until anti-aliasing kicks in. Is this a web browser issue? (FF27, windows 7 x86_64).
Earlier quoted context omitted.
yeah you'll need some code to animate the handles.
If by 'handles' you mean hands, what I built does that with CSS3's animation and transformations. No JS necessary. It's setting the initial positions that's the problem - CSS has no clock functionality. The only non-JS solution is to tell people to only load the page at exactly 12:00:00, but that's a bit impractical.
Very nice indeed. Technically you should be able to do the same thing in CSS... I knocked this together in 20 minutes as a proof of concept: http://codepen.io/onion2k/details/kmouK Sadly you'd need some JS to set them to the right time though, which rather ruins the beauty of it. I think. If anyone knows a way to do it without JS I'd love to hear how.
Very nice indeed. Technically you should be able to do the same thing in CSS... I knocked this together in 20 minutes as a proof of concept: http://codepen.io/onion2k/details/kmouK Sadly you'd need some JS to set them to the right time though, which rather ruins the beauty of it. I think. If anyone knows a way to do it without JS I'd love to hear how.
http://lee-phillips.org/skymap/
You might consider my solution cheating, however.
EDIT: The trick I used is basically what jwarren describes below.
Earlier quoted context omitted.
If by 'handles' you mean hands, what I built does that with CSS3's animation and transformations. No JS necessary. It's setting the initial positions that's the problem - CSS has no clock functionality. The only non-JS solution is to tell people to only load the page at exactly 12:00:00, but that's a bit impractical.
apparently a firefox issue, it doesn't animate in FF but does in Chrome.
The purple animal thing has the hands render at the wrong place (not the center) on my machine, cool idea though.