Excelente Menu Drop Down con jQuery y CSS

22 10 2009

Los estudios muestran que las navegaciones superior tienden a obtener la mayor atención visual cuando el primer usuario visita un sitio. Después de haber organizado y navegación intuitiva es la clave – y mientras la mayoría de los menús desplegables pueden parecer estéticamente agradable, el desarrollo de ellos para degradar gracia es también esencial. En este tutorial quiero ir sobre cómo crear una caída sexy menú desplegable que también pueden degradar con gracia.

Paso 1: HTML

En primer lugar crear una lista desordenada de navegación superior de su base. Después, simplemente nido otra lista no ordenada para la navegación secundaria.

 <ul class="topnav">
     <li><a href="#">Home</a></li>
     <li>
         <a href="#">Tutorials</a>
         <ul class="subnav">
             <li><a href="#">Sub Nav Link</a></li>
             <li><a href="#">Sub Nav Link</a></li>
         </ul>
     </li>
     <li>
         <a href="#">Resources</a>
         <ul class="subnav">
             <li><a href="#">Sub Nav Link</a></li>
             <li><a href="#">Sub Nav Link</a></li>
         </ul>
    </li>
     <li><a href="#">About Us</a></li>
     <li><a href="#">Advertise</a></li>
     <li><a href="#">Submit</a></li>
     <li><a href="#">Contact Us</a></li>
 </ul>

Leer el resto de esta entrada »





Galeria de Tablas con CSS / CSS Table Gallery

20 10 2009

tabla

Diseño de Tablas con CSS muy buenos para descargarlo, modificarlo lo que ustedes deseen.

Enlace : Ver





HTML 5 y Ajax

15 10 2009

HTML 5 es la última versión de una de las primeras lenguajes de los sitios web. El proyecto se inició en 2004 – una línea de tiempo adecuado teniendo en cuenta las mejoras en la industria de software y en línea han sido muy impresionantes. Esta actualización en HTML planes para atender más que interfaces simples en la adecuada creación de un sitio web.

En las versiones anteriores, el HTML es que acaba de hacer para cargar la página completa para cada solicitud de datos. Aunque esta opción es todavía adaptarse a sitios web simples, la carga cada vez mayor de los navegadores, incluso con HTML ha llevado a exigir cambios importantes en los idiomas página web. El mero hecho de que la adición de otros lenguajes de programación en la mayoría de los sitios web deben hacer los desarrolladores de buscar soluciones a los retos de HTML.

Leer el resto de esta entrada »





Stylizer Editor CSS

2 10 2009

style

Existen editores para todo y CSS no es una excepción. Sin embargo, el programa que nos ocupa no es un editor convencional, sino más bien podríamos decir que es un navegador con posibilidades de edición de las hojas de estilo CSS de las páginas que visitamos. No obstante, tampoco podemos decir que sea un navegador nuevo, sino que es una envoltura para distintos navegadores, que aporta utilidades adicionales para diseñar esquemas de página con CSS.

Stylizer es un producto comercial, pero que tiene una versión reducida que es gratuita. Al descargar la versión comercial disfrutamos del programa completo por 14 días, después de los cuales se queda limitado a la versión “Basic”, que es gratuita. Podemos descargarlo desde la página de inicio de la compañía desarrolladora.
Leer el resto de esta entrada »





AJAX en jQuery:mensaje de carga mientras el usuario espera la respuesta Ajax del servidor

26 09 2009

Por qué un mensaje de carga al hacer Ajax

Cuando hacemos una solicitud por Ajax, los resultados de dicha llamada a veces tardan en llegar. Durante ese tiempo el usuario puede no ver ninguna reacción por parte del navegador, lo que le puede confundir y pensar que no ha hecho clic correctamente en el enlace o botón. Sería normal en ese caso que el usuario pulse repetidas veces un enlace o un botón de envío de formulario, generando repetidas e innecesarias llamadas al servidor, lo que puede derivar en diversos problemas.

Así pues, es conveniente mostrar un mensaje de carga para advertir que su solicitud fue realizada y el proceso está en marcha y esperando respuesta del servidor.

Vamos a explicar la implementación de este mensaje de carga, pero siempre teniendo en cuenta que nuestra intención en este ejemplo es mantener un código pequeño que se pueda entender fácilmente. Aunque queremos remarcar que las cosas se podrían hacer de otra manera, algo mejorada, cuando sepamos más cosas sobre el framework Javascript jQuery y pongamos en marcha algunas prácticas aconsejables de programación orientada a objetos.

Preparando el código HTML
Como un primer paso, vamos a mostrar el código HTML que tendremos en la página que hará la solicitud Ajax.

<a href="#" id="enlaceajax">Haz clic!</a>
<div id="cargando" style="display:none; color: green;">Cargando...</div>
<br>
<div id="destino"></div>

Leer el resto de esta entrada »