| Home | Register | FAQ | Members List | Search | Today's Posts | Mark Forums Read |
|
|
|
|
#22 (permalink) |
|
Registered User
Join Date: Nov 2007
Posts: 25
|
Spiffy Corners introduces a lot of extraneous (X)HTML into documents. It can be difficult to generate on the fly (if working with dynamic content) and can cause code to become unwieldly. There are a few JS solutions which do the job well, Nifty Cube (IMO) being the pick of the bunch: Nifty Corners Cube - freedom to round Of course, the rounded corners aren't available to those who have chosen to disable JS, but it degrades well. It works on the same principle as Spiffy, but manipulating the DOM dynamically rather than explicitly adding the extra (X)HTML. You just need to weigh up the pros and cons of each approach on a project-by-project basis. |
|
|
|
#23 (permalink) |
|
Registered User
Join Date: May 2008
Posts: 1
|
It is possible to do anti-aliased rounded corners with JQuery as well. A relatively simple solution, but just like all JS, it won't work unless JS is enabled. Nevertheless, it works nicely and is packed just below 10kb. Search Google for "Blue Anvil Journal Anti-aliased Rounded Corners" and the first result should be a link to the post of the packed version of it. Then all you'll need is JQuery to get it to work. Use the packed version of that as well. jquery[dot]com |
|
|
|
#24 (permalink) | |
|
Registered User
Join Date: Mar 2008
Posts: 19
|
Quote:
Generating corners with markup, like spiffy corners does, is not a good idea, because it will slow down rendering. The solution I have posted before is the most flexible one I could find |
|
|
|
|
#25 (permalink) |
|
Registered User
Join Date: May 2008
Location: Seattle
Posts: 64
|
NiftyCorners Cube is very slick, but I have used it on a couple of sites for clients and found that it can seriously increase the load time of the page if you've got a lot of rounded areas to render. It also caused the page to flicker in IE, due to the delay in rendering the rounded corners. So, for me the solution was to only use it on boxes that had no height or width specified, and then to use images on everything else. If all the extra requests are an issue, you could try using css sprites. Another gotcha with Niftycube is that if you're using a gradient background, you may see that the area behind the rounded corners isn't always the same color as the page background. |
|
|
|
#26 (permalink) |
|
Registered User
Join Date: May 2008
Posts: 1
|
Niftycorners
Hi there! I found this thread while vacuum-cleaning the internet for a solution of my problem! The thing is that I want to use NiftyCorners (or something similar) to get rounded menu buttons. BUT, I need to use it on a background image, which doesnt work, small "triangles" with the background color appears where the "bends" are. Does anyone know how to get around this? The only thing I know is that I dont want to use an image-based menu, because I want to be able to change the colors in an easy way. I would be very very thankful for any help! Best regards, Wille (Sweden) |
|
|
|
#27 (permalink) |
|
Senior Member
Join Date: Oct 2007
Posts: 304
|
Then you'll just have to save your picture as a transparent image, if I understand your problem correctly. If the background from the OMFGCreator differs from the colour you will be using as background, this kind of thing naturally happens. -
|
|
|
|
#28 (permalink) | |
|
Design Destroyer
Join Date: Aug 2008
Location: Somewhere in Universe
Posts: 198
|
css rounded corners
Quote:
Check here Single image rounded corners - CSS - Tutorials - Vision.To Design |
|
|
|
|
#30 (permalink) | |
|
Soy Chingon!
|
Quote:
Try this - [example] Nifty Corners: Nifty Corners: HTML CSS rounded corners The code below shows how to get rounded corners using CSS. HTML Code:
and use an external css file: Code:
I hope this helps. The only thing to do now is just adjust heights and widths to your liking. Cheers! edit: i noticed a few already posted the link. Well, i just wanted to post here, to be more simple so that members dont need to read read read. Last edited by INXS : 23-09-2008 at 23:03. |
|
|
![]() |
|