 |
|||
|
Efectos JavaScript El Javascript es un lenguaje de scripts que puede ser incrustada en un documento HTML proporcionando un mecanismo para l eventos, como clicks del ratón. Este lenguaje ayuda potencia las aumenta del HTML y lo complementa, para generar efectos visuales y páginas mas dinámicas. Sí quieres saber algunas cosas más, pincha < < aquí >>.
Hay muy buenos portales con trucos Javascript para tu web. Algunos:
http://www.efectosjavascript.com/
http://www.creatupropiaweb.com/javascript/javascri.htm
1. Vamos a hacer un nuevo fondo para nuestra web , en este caso vamos a hacer un diseño con Layout que puedes realizar en Paint Shop Pro o PhotoShop, si no sabes hacer las imágenes puedes descargar los materiales aquí , incluí la Fuente que utilicé por si quieres ponerle un nombre a la Página sobre la imagen 900_01.png. El tutorial para armar las tablas lo puedes ver en el video, puedes usar los materiales que desees, pero para que no se descuadre la página cuando de agrandan las imágenes es importante utilizar una estructura parecida a esta:
2. Ya con nuestra nueva página elaborada le vamos a colocar estrellitas en el ratón, la conseguiremos aqui:Estrellitas de colores
Vas a copiar el código y a pegarlo entre <head> and </head>, puede ser debajo del título:
3. Vamos a poner un efecto de <Bienvenido a mi página> cuando entras a la Web sale un cartelito dando la bienvenida, copia el código abajo:
Lo pegas justo debajo del código anterior </script> :
4. Vamos a agregar una galería de fotos usando un tipo de archivo con terminación .js. Este es un JavaScript que se encuentra en una hoja Web aparte de la que mostramos a nuestros visitantes, está Web llama la función que hace el JavasScript desde el archivo .js, lo que permite tener una página sin tantos códigos incrustados.
Para este ejercicio vamos a subir la imágen galeria.png para usarla como título y buscaremos 5 imágenes que no sean tan grandes, que no pasen de 600 px de ancho y alto, porque la galería va a permitir mostrar la imagen del tamaño real al pasar el ratón sobre ellas:
También vamos a utilizar un código .js que vamos a guardar en la misma parte del alojamiento donde tenemos la Web que muestra el efecto y las imágenes, ese archivo lo vas a descargar copiando el enlace https://clementinaferri.com/web/expando.rar y pegandolo en la ventana del navegador, lo sacas del Zip y lo subes en el alojamiento:
A continuación centra el cursor, vas a copiar y pegar este código y vas a sustituir IMAGEN AQUI por la url de tu imagen:
Puedes estirar las imágenes para que se vean más proporcionadas y adecuarlas al espacio, pinchando sobre ellas:
5. Vamos a agregar un contador de visitas a tu página. Vamos a utilizar una web que tiene un servicio excelente de alojamientos y otras herramientas para webmaster llamada Mi arroba, para usarlos hay que registrarse y completado el proceso podemos incorporar algunos de esos servicios que consigues a la derecha de la página:
Seleccionamos <Nuevo contador >
Al abrirse la otra página rellenamos los datos, en este punto vas a pinchar con el boton derecho en Propiedades de la página y le colocas el nombre y ese lo colocas donde te lo piden:
Y escogemos el contador de nuestro agrado, de la lista que está a la derecha, podemos cambiar el color del borde, para este ejercicio coloqué el #955a7f:
Lo vamos a colocar debajo del Pie del Layout, como se observa en el ejercicio final . Bajamos unos dos espacios para quedar al pie de la celda y centramos:
Y vamos a insertar una tabla como la del vídeo-ejercicio
Volvemos a miarroba y copiamos el código Javascript :
Y lo pegamos dentro de la tabla, para eso vamos a Edición/Pegado Especial/No convertir:
6. Vamos a colocar un Scroll para que se vea más bonita la Web en Explorer, recuerda que en otros exploradores como Chome o Mozilla no se ve y que va acorde con los materiales sugeridos, si cuelgas tu propio diseño solo tienes que cambiar el código del color:
Aquí tienes el código si no utilizas los materiales del ejemplo sustituye el código de color: color: #955a7f
Lo vas a pegar antes del último </body>
Para finalizar colocale como fondo la imagen 9000.gif.
7. Para finalizar guarda y cuelga la página en tu espacio web. La página debe tener un aspecto parecido al que verás pinchando aquí.
|
|||
 |
