Espectaculares efectos en Ajax sin saber Ajax usando Dreamweaver | Dreamweaver o html | Iniciacion o explicacion |
Muchas veces diseñando una web nos encontramos que debemos crear efectos, como paneles que se desplegan o realizar verificaciones como la verificacion de formularios, y todo ello requiere un codigo complicado que puede tardar varias horas hacer funcionar. En ocasiones incluso no sabemos como hacer ese código. Bien, ahora Dreamweaver lo hace mas facil mediante Spry. ¿Que es Spry? Descubrelo en este video. Para obtener interesantes efectos en ajax, como fichas que ocultan su contenido, fichas que se comportan como acordeon, menus, paneles que muestran la informacion con botones, validacion de formularios en tiempo real y otros; Dreamweaver ha incorporado una utilidad que se llama Spry. Para usarla solo es necesario elegir Spry en el panel de inserciones, decidir que se quiere insertar e insertarlo. Esto te permitira presentar la información de tu sitio web de forma vistosa y novedosa. Algunas informaciones se pueden modificar reescribiendolas. Otras pueden trabajarse de forma dinamica. Tienes muchas opciones que deberás explorar, pero aquí te damos una guia para poder empezar y un ejemplo practico. Esto te dará una base para explorar otros efectos realizados con spry. La desventaja de esta utilidad es el peso de los archivos externos generados, que si bien no es excesiva, excede los tamaños maximos recomendables para archivos javascript y css. Sin embargo si eres principiante o no sabes nada de ajax esta utilidad te permitirá estar al nivel de los profesionales con unos pocos clicks y modificaciones al codigo CSS Como información complementaria será necesario que aprendas sobre como asignar caracteristicas a los diversos elementos de una pagina web usando CSS. INSERTANDO UN PANEL CON FICHAS Este efecto es conocido y útil. Puedes haberlo visto en sitios como el Correo de Yahoo u otros. Para hacerlo seguimos estos pasos: Vamos a la barra de inserciones. Si no la tenemos abierta debemos hacer click en Ventana, Insertar. Luego vamos a Spry. Finalmente hacemos click en el icono de paneles en fichas de Spry. Esto inserta un sistema prediseñado, compuesto por algo de codigo en la página y dos archivos externos: un archivo CSS y un archivo javascript que se encarga de que al presionar las fichas, cambie la informacion que se muestre. Podes escribir manualmente el contenido que deseas que se muestre. Para cambiar la ficha donde estas editando el contenido, simplemente presiona el ojo que aparece al pasar con el maus sobre ella. AÑADIENDO MAS FICHAS Es recomendable que añadas todas las fichas que necesites antes de cargar mucha informacion. Ve a la vista de codigo HTML. Veras que hay dos grandes grupos de tags: los tags li o de lista que constituyen los botones y los tags div o de las capas donde esta la información. Copia el codigo de uno de los tags li; luego pegalo debajo, y cambiar el nombre de la ficha. Posteriormente debes hacer lo mismo con las capas. Copia una y pegala exactamente en el mismo orden que el li que pegaste anteriormente. O sea, si la ficha nueva estaba en tercera posicion, coloca la capa en tercera posicion. De esta manera todo seguira funcionando. RETOCANDO LA ESTETICA Finalmente, para cambiar la estetica de la presentacion de las fichas debes buscar dentro de la carpeta Spry Assets el archivo CSS. Aquí estan todos los estilos que definen como se ven las fichas. Mediante prueba y error y según el grado de tus conocimientos en CSS, podrás modificar la estetica totalmente. Podrás utilizar imágenes de fondo, en vez de colores para lograr un aspecto mas profesional. ver video: http://www.rhosting.com.ar/ayuda/38/262/espectaculares-efectos-en-ajax-sin-saber-ajax-usando-dreamweaver

Fecha 2007-09-28 | 16900 visitas | por: www.videoblogargentina.com.ar