Curvy Corners te permite crear esquinas redondeadas

Curvy Corners es un javascript, muy facil de usar que te permite crear esquinas redondeadas en cualquier etiqueta DIV de HTML.  No se necesita saber nada de gráficos, ya que este javascripts hace todo, hasta genera las esquinas redondeadas de fondos compuestos de imágenes.





Para utilizarlo lo instalamos en el directorio raiz de nuestro sitio o blog, en donde se encuentra el archivo index.html.  Una vez instalado, podemos generar las esquinas redondeadas incluyendo el siguiente código en la etiqueta head del HTML:



 

<script type=”text/JavaScript” src=”rounded_corners.js”></script>

Luego creamos un elemento DIV, con un id, como en el siguiente caso:

<DIV id=”myDiv”></DIV>

Curvy Corners tomará la información de estilo directamente del contenido del elemento DIV.  Por último debemos incluir los parámetros necesarios para crear las esquinas redondeadas y por ejemplo si queremos que estas tengan un radio de 30 pixels, incluimos este código en el head:
<script type=”text/JavaScript”>

  window.onload = function()
  {
    settings = {
      tl: { radius: 30 },
      tr: { radius: 30 },
      bl: { radius: 30 },
      br: { radius: 30 },
      antiAlias: true,
      autoPad: false
    }

    var divObj = document.getElementById(”myDiv”);

    var cornersObj = new curvyCorners(settings, divObj);
    cornersObj.applyCornersToAll();
  }

</script>
Así de simple, pueden crear un sitio mas agradable, estéticamente hablando, sin utilizar ningún editor de gráficos.  Para los que utilizan el Dreamweaver pueden descargar una extensión que les permite usar Curvy Corners a través de un GUI. 


1 comment:

  1. Información Bitacoras.com...

    Si lo deseas, puedes hacer click para valorar este post en Bitacoras.com. Gracias....

    ReplyDelete