BorderRadius 1.2

BORDER RADIUS: NO CSS, NO IMAGES, MOOTOOLS ONLY!

BorderRadius is a Mootools's Plugin. BorderRadius makes corner more beautiful but does not use External Style Sheet or Images, it uses javascript only

BorderRadius was tested on:

Broswer:

IE6+, FF3+, Opera9+, Chrome2+, Safari4

Platform:

WindowXP+, Fedora7+, MacOS


Details

Author
Bui Minh Long
Current version
1.2
GitHub
minhlong139/BorderRadius
Downloads
8568
Category
Interface
Tags
Report
GitHub Issues

Releases


Dependencies

  • core/1.2.3: *

How to use

Javascript:

/* initialize */
$('#box').borderRadius({'radius: 10'});
/* other way */
new BorderRadius($('#box'), {'radius': 10});

HTML (Property options is optional):

<div id="box" options="{'radiusBottomRight':0, 'radiusTopLeft':0, 'css3': false}">
    Border Radius
</div>

Options

  • radiusTopLeft - (integer: defaults to 0) Radius of top left border corner.
  • radiusBottomLeft - (integer: defaults to 0) Radius of bottom left border corner.
  • radiusTopRight - (integer: defaults to 0) Radius of top right border corner.
  • radiusBottomRight - (integer: defaults to 0) Radius of bottom right border corner.
  • radiusTop - (integer: defaults to 0) Radius of top left and top right border corner.
  • radiusBottom - (integer: defaults to 0) Radius of bottom left and bottom right border corner.
  • radius - (integer: defaults to 0) Radius of 4 border corners.
  • parentBgColor - (color: defaults to '#fff') Fix parent element's background color.
  • borderWidth - (integer: defaults to null) Fix border width.
  • borderStyle - (string: defaults to null) Fix border style.
  • borderColor - (color: defaults to null) Fix border color.
  • css3 - (boolean: defaults to true) By default BorderRadius make radius corners by CSS3 if currently browser supported, else BorderRadius create radius corners by itself. If you want to make consitent, set css3 to false

What Is New In 1 2

  • Implement BorderRadius options by html property
  • Specify radius for each corners: top-left, top-right, bottom-left, bottom-right

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.

blog comments powered by Disqus