Finally! You can quickly and easily add round corners to almost any element: div tags, list items, span tags, text links and more.
This add-on is easy to install and use. Best of all you can use the built-in jQuery selector to choose which elements you wish to apply round corners to.
This add-on is ideal for: menus, sidebar backgrounds, page wrapper backgrounds, featured content, etc.
This add-on has been tested on Internet Explorer (including IE6), Firefox, Chrome and Safari.
Download from the Concrete5 Marketplace ($15)
Features:
- Quickly and easily add rounded edges with just a few clicks - no need for images anymore!
- Use the CSS-style selector to choose elements (eg. .example or #example)
- Control rounded edges on multiple elements on the same page with different settings (using just 1 block)
- Flexible control over rounding - round all corners, 2 corners or just 1.
- Anti-aliasing for smooth edges
- Works with both plain and backgrounds AND background images
- Supports borders (set via CSS)
- Supports transparency (to absorb coloring on corners from layer below affected element)
- Supports padding and margin (set via CSS)
- Supports background color change (eg. for hover on navigation menu link)
- Supports native rounding in Firefox and Chrome (for improved performance)
- Cross-browser support
- Degrades gracefully if visitor doesn't have Javascript enabled
- NEW (v1.3): It DOES support images now - not just background images
- NEW (v1.3): New rounding engine with support for jQuery 1.6 (old engine wasn't compatible)
Limitations:
- Does not work with Flash animations (as Flash uses a browser plugin)
- Does not work on form fields
Example:
This is an example of a background image.
This is an example of a background image with alternative corners and a border.
This is an example of nested rounded corners against a plain background.
This is an example of a background image with a foreground image as well.
Demonstration Video:
Screenshots:
