MooTools

How to use

It's very easy to use this component. You can use it on each object in your document. In this sample I use Rounded to obtain rounded corners on my div. In the first div I use the default radius (10px), in the second sample, in the second I specify a different value (5px)

HTML

<div id="second" style="background-color : #cccccc; width : 200px;height:30px; padding-left:1em"> 
    Second sample (corner 5px)
</div>

You can initialize corners on 'domready' event of your document

Javascript

window.addEvent('domready', function() {
    // round first div
    var myRound = new Rounded($$("#first"));
    // select radius in px
    var opt = {
        radius : "5px"
    }
    // round second div
    var myRound = new Rounded($$("#second"),opt);
});

The possible options are the follows :

radius: radius in pixel for your rounded corners,
selector: default selector if not specified,
cornered: css class used after transformation

Discuss

A note on comments here: These comments are moderated. No comments will show up until they are approved. Comments that are not productive (i.e. inflammatory, rude, etc) will not be approved.

Found a bug in this plugin? Please report it this repository's Github Issues.