时尚的 Javascript 进度(加载)栏...?
我目前正在开发一个与汽车相关的网站,我想在其中使用javascript(而不是flash)创建一个非常时尚的进度条。我希望它看起来类似于速度指示器,如下所示: http: //www.crestock.com/images/1260000-1269999/1260687-xs.jpg
因此,我在 Google 上搜索了 javascript 条形图,但只找到了简单的水平条形图。
我应该如何进行有什么想法吗?
Im currently developing a car related website in which I want to create a very stylish progress bar with javascript (not flash). I want it to look similar to a speed indicator, like this: http://www.crestock.com/images/1260000-1269999/1260687-xs.jpg
So I have done great couple of Google searches for javascript bars but only found simple horizontal bars.
Any ideas of how I should proceed?
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(2)
它实际上是完全可行的 - 请参阅这篇关于 Internet Explorer 中的 CSS3 旋转和过滤器的文章,并搜索 CSS3 Transform 属性 - http://www.useragentman.com/blog/2010/04/05/cross-browser-animated-css- Transforms-even-in-ie/
虽然我会在这里声明,但无论你出于什么目的使用 Javascript 加载栏,90% 的情况下它都不会很好。如果您的页面太大以至于需要加载栏,那么您真的应该考虑重新设计/重写网站的代码和设计。如果您想要动画只是为了动画,情况也是如此。
但我担心我可能说得有点太多了——不要因此而阻止你去了解一个非常有趣的技术,或者将它用于任何你认为必要的地方。如果您需要更多帮助,请对此问题发表评论。
It is actually quite doable - see this article on CSS3 rotation and filters in Internet Explorer, and also search for the CSS3 Transform property - http://www.useragentman.com/blog/2010/04/05/cross-browser-animated-css-transforms-even-in-ie/
Although I would state right here and then that whatever purpose you might have use for a Javascript loading bar be 90% of the time it can't be good. If your page is so big that it'll require a loading bar then you really really should consider a redesign/rewriting of your code and design for the site. The same would be if you want animation just for the sake of animation.
But I'm afraid I might have said a little too much - don't let that discourage you from having a look at a very interesting technique, or from using it on whatever you deem necessary. If you need more help just drop a comment on this question.
尝试一下JQueryUI。它有一些丰富的效果和 UI 小部件。
格茨
编辑:
我遇到过这个:
http://dev.sencha.com/deploy/ ext-4.0.2a/examples/charts/Gauge.html
give JQueryUI a shot. It has some rich effects and UI widgets.
Grtz
EDIT:
I came across this one:
http://dev.sencha.com/deploy/ext-4.0.2a/examples/charts/Gauge.html