Taller java script
Páginas: 94 (23335 palabras)
Publicado: 20 de febrero de 2012
Taller de Javascript - Manual completo
Página 1 de 113
Taller de Javascript
Manual por: DesarrolloWeb.com [http://www.desarrolloweb.com/] Versión on-line: "Tu mejor ayuda para aprender a hacer webs" http://www.desarrolloweb.com/manuales/22
Efectos rápidos con Javascript
Antes de meternos en materia podemos ver una serie de efectos rápidos que se pueden programar con Javascript. Estonos puede hacer una idea más clara de las capacidades y potencia del lenguaje que nos vendrán bien para tener una idea más exacta de lo que es Javascript a la hora de recorrer los siguientes capítulos. Abrir una ventana secundaria Primero vamos a ver que con una línea de Javascript podemos hacer cosas bastante atractivas. Por ejemplo podemos ver cómo abrir una ventana secundaria sin barras de menúsque muestre el buscador Google. El código sería el siguiente.
window.open("http://www.google.com","","width=550,height=420,menubar=no")
Podemos ver el ejemplo en marcha aquí
[http://www.desarrolloweb.com/articulos/ejemplos/javascript/abrir_vent_1.html].
Un mensaje de bienvenida Podemos mostrar una caja de texto emergente al terminarse de cargar la portada de nuestro sitio web, que podríadar la bienvenida a los visitantes.
window.alert("Bienvenido a mi sitio web. Gracias...")
Puedes ver el ejemplo en una página a parte
[http://www.desarrolloweb.com/articulos/ejemplos/javascript/bienvenida_1.html].
Fecha actual Veamos ahora un sencillo script para mostrar la fecha de hoy. A veces es muy interesante mostrarla en las webs para dar un efecto de que la página está al "aldía", es decir, está actualizada.
document.write(new Date())
Estas líneas deberían introducirse dentro del cuerpo de la página en el lugar donde queramos que aparezca la fecha de última actualización. Podemos ver el ejemplo en marcha aquí [http://www.desarrolloweb.com/articulos/ejemplos/javascript/fecha.html].
Nota: Un detalle a destacar es que la fecha aparece en un formato un poco raro,indicando también la hora y otros atributos de la misma, pero ya aprenderemos a obtener exactamente lo que deseemos en el formato correcto.
Botón de volver Otro ejemplo rápido se puede ver a continuación. Se trata de un botón para volver hacia atrás, como el que tenemos en la barra de herramientas del navegador. Ahora veremos una línea de
Taller de Javascript - Manual completo
Página 2 de 113código que mezcla HTML y Javascript para crear este botón que muestra la página anterior en el historial, si es que la hubiera.
El botón sería parecido al siguiente. Podemos pulsarlo para ver su funcionamiento (debería llevarnos a la página anterior). Atrás Como diferencia con los ejemplos anteriores, hay que destacar que en este caso la instrucción Javascript se encuentra dentro de unatributo de HTML, onclick, que indica que esa instrucción se tiene que ejecutar como respuesta a la pulsación del botón. Se ha podido comprobar la facilidad con la que se pueden realizar algunas acciones interesantes, existirían muchas otras muestras que nos reservamos para capítulos posteriores.
Apertura y configuración de popups con javascript
En determinadas ocasiones es muy útil abrir unenlace en una ventana secundaria, es decir, una ventana aparte que se abre para mostrar una información específica. Algunas ventajas de abrir un enlace en una ventana secundaria pueden ser que: El usuario no se marcha de la página donde estaba el enlace. La ventana secundaria se puede configurar libremente con lo que se pueden hacer ventanas más grandes o pequeñas y con más o menos menús. En general,el grado de control de la ventana secundaria utilizando Javascript aumenta.
Pincha aquí para ver lo que es una ventana secundaria
Para abrir una ventana secundaria podemos hacerlo de dos maneras, con HTML y con Javascript. Veamos cada una de ellas Abrir una ventana con HTML Se puede conseguir abrir una ventana secundaria muy fácilmente con tan solo HTML. Para ello podemos utilizar el...
Página 1 de 113
Taller de Javascript
Manual por: DesarrolloWeb.com [http://www.desarrolloweb.com/] Versión on-line: "Tu mejor ayuda para aprender a hacer webs" http://www.desarrolloweb.com/manuales/22
Efectos rápidos con Javascript
Antes de meternos en materia podemos ver una serie de efectos rápidos que se pueden programar con Javascript. Estonos puede hacer una idea más clara de las capacidades y potencia del lenguaje que nos vendrán bien para tener una idea más exacta de lo que es Javascript a la hora de recorrer los siguientes capítulos. Abrir una ventana secundaria Primero vamos a ver que con una línea de Javascript podemos hacer cosas bastante atractivas. Por ejemplo podemos ver cómo abrir una ventana secundaria sin barras de menúsque muestre el buscador Google. El código sería el siguiente.
window.open("http://www.google.com","","width=550,height=420,menubar=no")
Podemos ver el ejemplo en marcha aquí
[http://www.desarrolloweb.com/articulos/ejemplos/javascript/abrir_vent_1.html].
Un mensaje de bienvenida Podemos mostrar una caja de texto emergente al terminarse de cargar la portada de nuestro sitio web, que podríadar la bienvenida a los visitantes.
window.alert("Bienvenido a mi sitio web. Gracias...")
Puedes ver el ejemplo en una página a parte
[http://www.desarrolloweb.com/articulos/ejemplos/javascript/bienvenida_1.html].
Fecha actual Veamos ahora un sencillo script para mostrar la fecha de hoy. A veces es muy interesante mostrarla en las webs para dar un efecto de que la página está al "aldía", es decir, está actualizada.
document.write(new Date())
Estas líneas deberían introducirse dentro del cuerpo de la página en el lugar donde queramos que aparezca la fecha de última actualización. Podemos ver el ejemplo en marcha aquí [http://www.desarrolloweb.com/articulos/ejemplos/javascript/fecha.html].
Nota: Un detalle a destacar es que la fecha aparece en un formato un poco raro,indicando también la hora y otros atributos de la misma, pero ya aprenderemos a obtener exactamente lo que deseemos en el formato correcto.
Botón de volver Otro ejemplo rápido se puede ver a continuación. Se trata de un botón para volver hacia atrás, como el que tenemos en la barra de herramientas del navegador. Ahora veremos una línea de
Taller de Javascript - Manual completo
Página 2 de 113código que mezcla HTML y Javascript para crear este botón que muestra la página anterior en el historial, si es que la hubiera.
El botón sería parecido al siguiente. Podemos pulsarlo para ver su funcionamiento (debería llevarnos a la página anterior). Atrás Como diferencia con los ejemplos anteriores, hay que destacar que en este caso la instrucción Javascript se encuentra dentro de unatributo de HTML, onclick, que indica que esa instrucción se tiene que ejecutar como respuesta a la pulsación del botón. Se ha podido comprobar la facilidad con la que se pueden realizar algunas acciones interesantes, existirían muchas otras muestras que nos reservamos para capítulos posteriores.
Apertura y configuración de popups con javascript
En determinadas ocasiones es muy útil abrir unenlace en una ventana secundaria, es decir, una ventana aparte que se abre para mostrar una información específica. Algunas ventajas de abrir un enlace en una ventana secundaria pueden ser que: El usuario no se marcha de la página donde estaba el enlace. La ventana secundaria se puede configurar libremente con lo que se pueden hacer ventanas más grandes o pequeñas y con más o menos menús. En general,el grado de control de la ventana secundaria utilizando Javascript aumenta.
Pincha aquí para ver lo que es una ventana secundaria
Para abrir una ventana secundaria podemos hacerlo de dos maneras, con HTML y con Javascript. Veamos cada una de ellas Abrir una ventana con HTML Se puede conseguir abrir una ventana secundaria muy fácilmente con tan solo HTML. Para ello podemos utilizar el...
Leer documento completo
Regístrate para leer el documento completo.