Blog and Web

Esquinas redondeadas con jQuery

jQuery Corners es un plugin que te permite crear esquinas redondeadas de una manera muy sencilla, sin imágenes o maquetación adicional en el código. Simplemente se define una clase y se aplica a un elemento HTML. Paso a paso esto sería:

1. Descarga jQuery y jQuery corners y haz el llamado dentro de las etiquetas <head> y </head>:

<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="jquery.corner.js"></script>

2. Se define la clase que creará las esquinas redondeadas de la siguiente forma:

<script>$(document).ready( function(){
  $('.redondas').corners();
});</script>

3. Y simplemente se aplica la clase a cualquier elemento HTML, por ejemplo a un típico selector DIV:

<div class="redondas">
	Contenedor con esquinas redondeadas.
</div>

Esta es la forma más sencillas de utilizar el script, pero tiene varias opciones de configuración, como definir el radio de curvatura general o para cada esquina o aplicar el script a botones de formulario que se pueden consultar en su sitio oficial.

Es soportado por la mayoría de los navegadores e inclusive por el iPhone.