UD 1: Disseny web amb Macromedia Dreamweaver
JavaScript: exercicis
Disseny de la pàgina
Obriu el disseny DAI.png en Fireworks. Exporteu-lo com fitxer HTML: Archivo | Exportar , amb les opcions Tipo HTML e imágenes, Exportar divisiones, Incluir áreas en divisiones, Colocar imágenes en subcarpeta. Obtindreu el fitxer DAI.html.
Obriu la pàgina HTML en Dreamweaver. Verifiqueu que estigui correctament exportada.
Comportaments: formularis, botons, ...
Per cada imatge que mostra el nom d'un crèdit, com ara "Anàlisi i
disseny d'aplicacions" o "Programació I i II", definiu un comportament
"obrir una finestra del navegador" per mostrar la pàgina http://iesbaixcamp.org/~jcuesta/WebDepinfo/dai.htm quan fem un clic del ratolí sobre elles.
Imatges de sustitució i barres de navegació
Les imatges bits.png, organigrama.png, ide.png, xarxes.png i java.jpg
són versions modificades de les imatges que es mostren en la barra
superior de la pàgina DAI.html. Utilitzeu-les per definir comportaments
"rollover" per cada una d'aquestes imatges. Totes elles tenen el mateix
vincle: http://iesbaixcamp.org/~jcuesta/WebDepinfo/dai.htm
Javascripts externs
Busqueu a la xarxa una funció javascript que mostri la data actual en
la pàgina. Inseriu-la en la part lliure de la pàgina, abaix a la dreta.
Extensions DW:
descarregueu l'extensió Advanced Random Images i instal·leu-la usant
Macromedia Extension Manager. En el menú Comandos apareix l'entrada
"Kaosweaver.com". Serveix per mostrar una imatge que va canviant
periòdicament, per exemple cada dia mostra un de diferent, o bé cada
cop que es visita la pàgina. Utilitzeu-la per mostrar en l'última
casella de la columna esquerra de la taula una imatge alatòria, triada
d'entre al menys quatre imatges diferents. La imatge es mostrarà amb
una grandària de 100 X 100 píxels i centrada en la casella,
independentment de la grandària real.
|