Bordes redondeados con jQuery sin imágenes

Escrito por: el 13-07-2009 11:58:34 y leído 8136 veces

Bordes redondeados con jQuery sin imágenes

Seguramente ya habrás utilizado o conocerás esta técnica. Se trata de poder utilizar bordes redondeados (que tan bien quedan) en los elementos de tu web sin utilizar imágenes para ello. El método, se vale de jQuery para adaptar los divs que indiques con el efecto que desees y, como se puede ver en la demo online que publiqué, es totalmente transparente con respecto a tu fondo.

Para aplicarlo, luego de agregar la librería jQuery en el head de tu web, debes indicar qué capa quieres redondear y el plugin se encarga de todo.

Mírate los códigos que aparecen a continuación, o mira el source de la demo.

Código CSS

/* esto no es necesario, puedes utilizar tus propios estilos */
body {background:#333 }
body, div, h1 { font-family: arial; margin: 0; padding: 0;font-size:18px;}
div.ejemplo { background-color: #ccc; padding: 20px;float:left;margin:20px}

Código JAVASCRIPT

$('#ejemplo1').corner();

Código XHTML

<div id="ejemplo1" class="ejemplo"><h1>Esto es un ejemplo: round</h1></div>

Categorías: Bordes RedondeadosJquery

Artículos relacionados:


100 Búsquedas de este artículo:

bordes redondeados jquerybordes redondeados con jqueryjquery bordes redondeadosborde redondeado jquerydiv redondeado jqueryredondear div jquerydiv bordes redondeados jquerybordes jqueryredondear imagenes con jqueryredondear bordes jquerybordes redondos jqueryjquery border redondojquery borde redondeadobordes con jquerydiv redondeados con jqueryjquery fotos redondeadastablas jquery cssFormulario transparente con jquerydiv redondeados jqueryjquery bordesbordes redondos con jquerytextbox redondeados csstablas elegante jquerymenu redondeado jqueryborde redondeado con jquerytablas css jqueryborde imagen jqueryborder redondeados jquerymenu redondos jquerytabla redondeada cssjquery div redondeadomenu redondeado con jqueryredondear esquinas div jquerybordes redondeados jquery 2011html capa redondear fotos máscarajquery redondear imagenredondear div con jqueryhacer bordes redondeados jqueryredondear con jqueryredondear bordes tabla jquerybordes curvos jquerybotones redondeados jqueryjquery para redondear imagenesbordes redondeados css jqueryinput redondeado cssredondear esquinas de un div con jqueryjquery bordes redondosredondear marcos htmlcssjquery bordes redondeados en libotones redondos htmltextbox redondeadosredondear capas jqueryjquery para redondear bordesimagenes con esquinas redondeadas jqueryredondeo de esuinas con jquerybordes redondeados webinput con bordes redondeadosdiv con bordes redondeados jquerybordes para iglesiasdivs bordes redondos sin imagenesdiv con bordes redondeadosjquery div redondeadosbordes redondeados en jqueryredondear divs con jquerydiv redondeado con imagenesjquery borde redondobordes redondeados div jqueryjquery para bordes redondeadostabla esquina redonda jquery uiredondear sin imagenes jquerydivs redondeados jqueryjquery cuadros redondeadosjquery redondear divcss punta redondeadajquery ui bordes redondeadosborde al div en css ejemplosjquery bordes redondeados imagenestransparente fondo jqueryredondear bordes de div con jqueryboton redondo javascriptredondear tablas htmljquery show estilo explorercomo hacer figuras redondeadas con jqueryborder redondeados con jquerydiv con bordes redondeados con jquerybordes en jquerycomo nndar estilos curveados a las tablas en html#hl=esborde curvo jquerytablas con bordes redondeados jquerytextbox redondeado htmlcodigo html tabla con punta redonda e imagenponer borde a un select jquerydiv con bordes redondeados javascriptbordes redondeados en html con jqueryjquery bordes curvosPLUGIN JQUERY PARA BORDES REDONDEADOSBordes redondeados en la Web con jQueryacordeón jquery borde redondeadodiv borde redondeado jquerybordes redondeados jquerry

Traduce esta página

Nube de Tags

Libros de Romantica

Los 20 posts más populares

Usuarios Conectados...

  • Hay 9 usuario/s en esta página
¿Sabías qué?
Yo digo
Miembro de

BlocketPCSubflashADWE

© 2012 Martin Iglesias - Todos los derechos reservados

Creative Commons LicenseValid XHTML 1.0 Transitional¡CSS Válido!Suscribete a mi RSSHumans TXT