So there's no shortage of information out there on rounded corners and I've been through much of it and I'm posting to get the opinions of the communities on this point.
所以在圆角上并不缺少信息,我已经完成了大部分工作,并且我发布了这一点以获得社区的意见。
My scenario is that we're developing a rounded corner dependent design, mainly used for interactions (<button> and <a>). We are going to use border radius for the good browsers on the block that play nice with it and then use the server to send down JavaScript to browsers that don't.
我的场景是我们正在开发一个圆角的设计,主要用于交互(
What I'm wondering is what to use to up scale the browsers that ignore border radius CSS? I need something that works on button as well as a, div etc. I've been looking at the following and have found that some don't play nice with <button>. Also the site already uses jQuery.
我想知道用什么来扩展忽略边缘半径CSS的浏览器?我需要一些适用于按钮以及a,div等的东西。我一直在寻找以下内容,并发现有些不适合
http://www.curvycorners.net/ - http://code.google.com/p/jquerycurvycorners/
http://www.curvycorners.net/ - http://code.google.com/p/jquerycurvycorners/
http://www.html.it/articoli/niftycube/index.html
http://www.malsup.com/jquery/corner/
Edit: I've also looked at http://www.dillerdesign.com/experiment/DD_roundies/ and at this point it seems the strongest candidate to me.
编辑:我也看了http://www.dillerdesign.com/experiment/DD_roundies/,在这一点上它似乎是我最强的候选人。
6 个解决方案
#1
2
Use the one that works and gets the project done on time. Beyond that you're not likely to get much useful feedback on this as they all suck from one standpoint or another depending on how you view images, javascript, semantics, adding extra tags to "make it work", etc.
使用有效的方法并按时完成项目。除此之外,你不太可能得到很多有用的反馈,因为他们都从一个或另一个角度来看,这取决于你如何查看图像,javascript,语义,添加额外的标签以“使其工作”等。
#2
3
They're all much the same. I've used the last one (http://www.malsup.com/jquery/corner/) and it works great. Almost certainly has more corner styles than you care about, but at 8KB, it's not too heavyweight.
他们都是一样的。我已经使用了最后一个(http://www.malsup.com/jquery/corner/)并且效果很好。几乎可以肯定有比你关心的更多的角落风格,但在8KB,它不是太重量级。
#3
1
Overall, you should just go with the -webkit-border-radius as well as the -moz-border-radius to support all Webkit and Mozilla browsers. To have a fix with IE, there is a javascript function to do that. Hope that helps!
总的来说,您应该使用-webkit-border-radius以及-moz-border-radius来支持所有Webkit和Mozilla浏览器。要修复IE,有一个javascript函数可以做到这一点。希望有所帮助!
#4
1
spiffycorners.com has a 100% css approach that even works in IE6! This is what I use...
spiffycorners.com有100%的css方法,甚至可以在IE6中使用!这是我用的......
#5
0
I've had some experience with the Javascript methods described above and they all work great. Personally I would go for something that integrates well with existing Javascript frameworks, like JQuery (which would be my personal choice).
我对上面介绍的Javascript方法有一些经验,但它们都很有效。就个人而言,我会选择与现有Javascript框架完美集成的东西,比如JQuery(这将是我个人的选择)。
Applying the effect to a lot of elements can be very cumbersome for the browser in terms of memory usage however. I've had quite a lot of browser crashes due to me being too generous with applying corner effects.
然而,就内存使用而言,将效果应用于许多元素对于浏览器来说可能是非常麻烦的。我有很多浏览器崩溃,因为我对应用角落效果太慷慨了。
#6
0
Have you looked at Stu Nicholis' CSS play? His Snazzy Borders and Krazy Korners are a nice cross-browser solution.
你看过Stu Nicholis的CSS游戏吗?他的Snazzy Borders和Krazy Korners是一个很好的跨浏览器解决方案。
#1
2
Use the one that works and gets the project done on time. Beyond that you're not likely to get much useful feedback on this as they all suck from one standpoint or another depending on how you view images, javascript, semantics, adding extra tags to "make it work", etc.
使用有效的方法并按时完成项目。除此之外,你不太可能得到很多有用的反馈,因为他们都从一个或另一个角度来看,这取决于你如何查看图像,javascript,语义,添加额外的标签以“使其工作”等。
#2
3
They're all much the same. I've used the last one (http://www.malsup.com/jquery/corner/) and it works great. Almost certainly has more corner styles than you care about, but at 8KB, it's not too heavyweight.
他们都是一样的。我已经使用了最后一个(http://www.malsup.com/jquery/corner/)并且效果很好。几乎可以肯定有比你关心的更多的角落风格,但在8KB,它不是太重量级。
#3
1
Overall, you should just go with the -webkit-border-radius as well as the -moz-border-radius to support all Webkit and Mozilla browsers. To have a fix with IE, there is a javascript function to do that. Hope that helps!
总的来说,您应该使用-webkit-border-radius以及-moz-border-radius来支持所有Webkit和Mozilla浏览器。要修复IE,有一个javascript函数可以做到这一点。希望有所帮助!
#4
1
spiffycorners.com has a 100% css approach that even works in IE6! This is what I use...
spiffycorners.com有100%的css方法,甚至可以在IE6中使用!这是我用的......
#5
0
I've had some experience with the Javascript methods described above and they all work great. Personally I would go for something that integrates well with existing Javascript frameworks, like JQuery (which would be my personal choice).
我对上面介绍的Javascript方法有一些经验,但它们都很有效。就个人而言,我会选择与现有Javascript框架完美集成的东西,比如JQuery(这将是我个人的选择)。
Applying the effect to a lot of elements can be very cumbersome for the browser in terms of memory usage however. I've had quite a lot of browser crashes due to me being too generous with applying corner effects.
然而,就内存使用而言,将效果应用于许多元素对于浏览器来说可能是非常麻烦的。我有很多浏览器崩溃,因为我对应用角落效果太慷慨了。
#6
0
Have you looked at Stu Nicholis' CSS play? His Snazzy Borders and Krazy Korners are a nice cross-browser solution.
你看过Stu Nicholis的CSS游戏吗?他的Snazzy Borders和Krazy Korners是一个很好的跨浏览器解决方案。