Estilizar listas con jQuery y CSS
Algunas veces, ya sea por estética o para dar un mejor estilo a nuestros módulos, sistemas o páginas, resulta interesante reemplazar los estilos de los objetos HTML. Este post va ser el comienzo de una serie de posts para reemplazar la estica de estos elementos. Para nuestro objetivo nos valemos del framework jQuery y algo de CSS. Empezaremos con las listas, es totalmente aplicable, tanto a listas ordenadas como desordenadas.
Menu Drop Down con jQuery y CSS
Vamos a desarrollar un menu estilo Drop Down, de fácil mantenimeinto, usable y accesible con jQuery y CSS:
1º Paso: HTML
Comenzamos creando una lista desordenada con <ul> que luego será nuestro menu, de esta forma:
Combos anidados dependientes con jQuery
Buscando una respuesta para realizar combos anidados y dependientes, de forma tal, que sea de fácil mantenimiento y aplicable a cualquier circunstancia, me encontré nuevamente con una solución aplicando jQuery y Ajax.
Para comenzar creamos las líneas de código para los dos combos, aunque, es aplicable para más de dos, para explicarlo de forma clara solo utilizaré estos dos.
Vamos a hacerlo con los dos lenguajes mas utilizados ASP y PHP.
Creamos los select, nos quedaría algo como esto:
Formulario de Contacto Modal con jQuery
jQuery me sorprende cada días más, por diferentes motivos, su facilidad en la implementación, la simplicidad a la hora de codificar y por la comunidad que cada día crece más y más. Por recomendación de mi compañero Adrian me encontre con el Blog de Eric Martin, en el cual nos muestra una forma diferente de hacer un formulario de contacto estilo Modal. Acá la Demo
Su implementación es muy simple, solo debemos tener en cuenta las siguientes lineas de código:
Tecnología AJAX con jQuery y CSS
AJAX son las siglas de Asynchronous JavaScript And XML. No es un lenguaje de programación sino un conjunto de tecnologías (HTML-JavaScript-CSS-DHTML-PHP/ASP.NET/JSP-XML) que nos permiten hacer páginas de internet más interactivas.
La característica fundamental de AJAX es permitir actualizar parte de una página con información que se encuentra en el servidor sin tener que refrescar completamente la página. De modo similar podemos enviar información al servidor.
Enmascarar (MaskEdit) cajas de texto con jQuery
Desde digitalbush.com me encuentro con este plugin para jQuery, donde nos permite enmascarar (maskedit) nuestras cajas de texto (input type=”text”), como se ve en la imagen. De esta manera mejoramos la usabilidad de nuestros formularios. Para tal fin necesitaremos descargar la librería jQuery desde su sitio oficial y el plugin mensionado anteriormente.
Carrousel (jCarrousel) de Imagenes con jQuery
Desde el sitio de sorgalla.com me encontre como hacer una carrousel de imagenes interesante y simple a la vez con jQuery y css.