Very Simple jQuery Rounded Corners Example

Its very easy to get the rounded corners for HTNL element.

follow the very simple 3 steps:

1) Copy the CSS code to <style> </style>

2) Copy the jQuery code to <script> </script>

3) Copy the jQuery code to <body> </body>

That's it.


//CSS
.madiv{border:1px solid #666666;margin-left:20%;margin-right:20%;margin-top:50px;width:300px;height:300px;}

//jQuery Code
$(document).ready(function(){
$(".maincontainer").addClass("madiv");
$.fn.roundThis = function(radius) {
return this.each(function(e) {
$(this).css({
"border-radius": radius,
"-moz-border-radius": radius,
"-webkit-border-radius": radius
});
});
};

$(function() {
// usage (Rounded corners with radius :20px)
$(".maincontainer").roundThis("50px");
});
});

// HTML
<div align="center" class="maincontainer">  

</div>