Dreamweaver - CS3

Lección 17: Ligas (4)

17/58 Lecciones 

Navegación

También pra crear una barra de navegación, usamos diferentes gráficas para ver los cambios, dependiendo de las acciones que el usuario desempeñe.

Un botón en la barra de navegación puede ser encontrado en cuatro posiciones, entonces tengo que bajar el archivo por cada uno de los cuatro para el botón.

Arriba: Esta imagen es desplegada cuando no hay interacción de usuario en éste botón.

Sobre: Esta imagen es desplegada cuando el usuario mueve el mouse por encima del botón.

Abajo: Esta imagen aparece cuando el usuario presiona el botón.

Sobre mientras abajo: ésta imagen aparece cuando el usuario está en la página de nuestro sitio.

He guardado todos esos botones en la carpeta “imagenes” del subdirectorio “botones” del mapa de sitio “Electro_GC_03”.

 

 

Arria Sobre Abajo sobre abajo

Para añadir una barra de navegación, primero colocamos el cursor en el lugar que queramos en la página.

Haz click en el botón “Insertar” de la barra de menu, elije “Objetos de Imagen” y haz click “Navigación”.
Esto abre el panel de navegación “Insertar Navigación”. Parecería ser complicado, pero no lo es. Sencillísimo.

Lo primero es lo que introdujimos en el “Nombre Elemento:” un nombre para el primer botón.

En éste caso, el botón “Home”, entonces yo escribo “Home”, ¿qué estabas pensando?

En la siguiente caja (“Imagen Arriba”), seleccionamos, haciendo click en el botón “Buscar”, la imagen a ser desplegada cuando éste intercambio está en posición “standby”. En otras palabras, si no hay interacción del visitante.
Entonces la imagen “Home_up.jpg”.

En la siguiente caja (“Sobre Imagen”), seleccionamos, haciendo click en el botón “Buscar”, la imagen a ser desplegada cuando el mouse del visitantes, me refiero al mouse de su computadora, lo mueve sobre el botón.

Entonces la imagen “Home_over.jpg”.

En la siguiente caja (“Imagen Abajo”), seleccionamos, haciendo click en el botón “Buscar”, la imagen a ser desplegada cuando el visitante haga click en éste botón.

En la siguiente caja (“Over While Down Image”), seleccionamos, haciendo click en el botón “Buscar”, la imagen a ser desplegada cuando el visitante esté en nuestro sitio web.

En la siguiente sección un posible texto alternativo para los visitantes con la opción “Mostrar Imagenes” en su navegador deshabilitada.

Y la caja “Cuando sea clickeada, Ir a URL:” la mantenemos en blanco para ésta página. Es la página de inicio en donde estoy agregando la navegación, es por eso.

Ya discutimos acerca de “Precargar Imagenes.

Y el “Mostrar abajo imagen inicializada”, seleccionamos el botón cuando estés configuarando ésta página para representar donde estás trabajando. En otras palabras, aclara al visitante que éste botón no es clickeable otra vez, cuando el visitante sea parte del sitio.

Actualmente estoy agregando una barra de navegación al índice de la página del sitio, ésta es la página inicial, entonces la imagen Dreamweaver en ésta página está en la vista “imagen abajo”.

Para la caja “Insertar”, escoge la opción “Horizontal” o “Vertical”, dependiendo en cómo quieras la barra de navegación. En éste caso, “horizontal”.

Y finalmente tenemos la casilla de verificación “Usar Tablas”.

Cuando verificas esta casilla, habrán varios botones en diferentes celdas de la tabla.

Repite esos pasos para todos los botones que quieras añadir a la barra de navegación, haciendo click en el botón + en la parte superior de la ventana de diálogo.

Haciendo click en el botón – puedes remover botones de la barra de navegación. Seleccionalo primero en “Elementos de Navegación”.

Seleccionando un botón en “Elementos de Navegación” y haciendo click en los botones con la flecha apuntando hacia arriba o hacia abajo, puedes cambiar el orden de los botones.

Haz click en Aceptar cuando termines.

Ahora no tienes que repetir esas operaciones por cada página.

Selecciona todos los botones en la barra de navegación, haz click en Ctrl + C de tu teclado.

Abre la página donde quieres insertar la barra de navegación. Selecciona la locación de tu página donde quieras tenerla.

Y haz click en los botones Ctrl + V de tu teclado.

Esto coloca la navegación en ésta página.

Lo que tienes que hacer es, para el botón que está bajo, remueve la liga a ésta página y selecciona la casilla “Show Down image initially”.

Y 2, para el botón deshabilitado, introduce “Cuando sea clickeado, Ir a URL:” campo y casilla sin verificación “Show Down image initiaaly”.

Haz click en el botón “Cambio” en la barra de menu y selecciona “Cambiar Navegación” en el menu desplegable.

Atención, cuando las páginas están en diferentes directorios, necesitarás más que introducir diferentes vistas de imagenes.

Increíble! Has completado Lección 17 INICIAR EL PROXIMO LECCIÓN