Tutorial

Antes de comenzar con la creación de la Barra de navegación usted deberá tener preparadas ciertas imágenes. Para el desarrollo de esta lección se han creado una serie de imágenes que servirán para la creación de una Barra de Navegación.

Estas son las imágenes:

Abajo Arriba Sobre
barra de navegación barra de navegación barra de navegación
barra de navegación barra de navegación barra de navegación
barra de navegación barra de navegación barra de navegación
barra de navegación barra de navegación barra de navegación

 

Para comenzar con la creación de la Barra de Navegación en primera instancia deberá diríjirse al menú principal del programa y seleccionar la opción Insertar, seguidamente seleccione Objetos de imagen, a continuación aparecerá un menú emergente, en éste elija la opción Barra de Navegación.

Barra de Navegación

Una manera rápida de insertar una Barra de Navegación es desde el panel Insertar, en el menú Común, Imágenes: Barra de Navegación.

Barra de Navegación

En este instante usted podrá apreciar el cuadro de dialogo Insertar barra de navegación, en éste podrá observar los siguientes campos:

Nombre de elemento:

Servirá como referencia al elemento.

Imagen arriba:

Acá se indicará la dirección relativa a la imagen que se encontrará de manera predeterminada (similar al estado OFF de las imágenes de sustitución o rollover).

Sobre imagen:

En este campo se indicará la dirección relativa a la imagen que aparecerá cuando el cursor de mouse se encuentre encima (similiar al estado ON de las imágenes de sustitución o rollover).

Imagen Abajo:

En este campo se indicará la dirección relativa a la imagen que hará aparición en el instante en el cual se haga click sobre dicha imagen.

Texto Alternativo:

Este campo se refiere al texto que aparecerá cuando el cursor del mouse se encuentre varios segundos sobre la imagen en cuestión, normalmente este recurso se utiliza como referencia o explicación sobre la aplicación de la imagen.

Al hacerse clic, ir a URL:

Este campo se refiere a la inclusión de un enlace o hipervinculo.

Es recomendable marcar la casilla de verificación Carga previa de imágenes ya que de esta manera las imágenes “ocultas” (Imagen Sobre e Imagen abajo) se cargarán previamente a su solicitud, de esta manera se evita una posible tardanza en la presentación de dichas imágenes.

En importante mencionar que se recomienda marcar también la casilla de verificación Utilizar Tablas, puesto que de esta manera se podrá maniobrar con la Barra de Navegación, esto implica además una mayor organización.

Usted podrá Insertar su Barra de Navegación tanto horizontal como verticalmente, esto depende de sus necesidades.

En este instante se procederá a explicar los pasos a seguir para el desarrollo de la barra de navegación mostrada en el ejemplo.

En el cuadro de dialogo Insertar barra de navegación, se rellenarón los campos requeridos de la siguiente manera:

Barra de Navegación

 

Al terminar de rellenar todos los campos de la primera imagen NO de click en Aceptar, proceda a seleccionar el botón Botón Añadir Elemento, el cual se ubica en la parte superior izquierda del cuadro de dialogo Insertar Barra de Navegación. Debe seguir la misma rutina hasta completar de rellenar todos los campos de las correspondientes imágenes. Una vez completada la inserción de los elementos usted podrá reacomodarlos en caso de ser necesario, para tal fín usted deberá seleccionar en primer lugar el elemento que desea reacomodar desde el campo Elementos de barra de navegación, posteriormente seleccionará el botón Botón Subir Elemento en la lista o el botón Botón Bajar Elemento en la lista, según sea su caso.

Si usted desea eliminar un elemento de la barra de navegación, en primer lugar deberá seleccionar el elemento en el campo Elementos de Barra de Navegación, posteriormente seleccionará el botón Botón Quitar Elemento.

Después de completar el rellenado de los campos de todas las imágenes que se incluirán en la Barra de Navegación dé click en Aceptar.

En el caso que usted esté inconforme con algún resultado después de la inserción de la barra de navegación, podrá modificar las características de ésta al dar click de nuevo sobre el botón Barra de Navegación Botón de Barra de Navegación o en su defecto diríjase al menú principal y seleccione la opción Insertar, posteriormente elija Objetos de imagen e inmediatamente seleccione del menú emergente la opción Barra de Navegación. Después de ello usted podrá apreciar la siguiente imagen.

Advertencia previa a la modificación de la Barra de Navegación.

Simplemente dé click en Aceptar y proceda a modificar los valores que usted desee desde el cuadro de dialogo Insertar Barra de Navegación.

25 diciembre, 2014
dreamweaver

Crear barra de navegación en DreamWeaver

Antes de comenzar con la creación de la Barra de navegación usted deberá tener preparadas ciertas imágenes. Para el desarrollo de esta lección se han creado […]
25 diciembre, 2014
dreamweaver

Crear un album de fotos con DreamWeaver

En esta lección usted aprenderá a Crear un Album de Fotos Web, para tal efecto, en primera instancia usted necesitará tener una carpeta que contenga las […]
25 diciembre, 2014
dreamweaver

Crear un sitio local nuevo básico

La creación de un sitio Web con Dreamweaver MX implica dos pasos fundamentales: 1º) crear las carpetas en el disco local: disco duro (C) con el […]
25 diciembre, 2014
dreamweaver

Editar Textos con DreamWeaver

A.- CREAR Y CONFIGURAR LA PÁGINA O DOCUMENTO 1.- Crear Página: Archivo – Nuevo (figura 2-1)- Aparece el cuadro de diálogo «Nuevo documento» – En la […]
25 diciembre, 2014
dreamweaver

Crear enlaces con DreamWeaver

A.- CREAR VÍNCULOS (=ENLACES) EN UNA PÁGINA 1.- Seleccionar texto o imagen que servirá de vínculo 2.- Modificar – Crear vínculo 3.- Buscar y seleccionar el […]
25 diciembre, 2014
dreamweaver

Entorno de trabajo de DreamWeaver MX

A.- INICIAR EL PROGRAMA DREAMWEAVER MX.- Para abrir Dreamweaver MX, llevar a cabo una de estas operaciones: 1.- Inicio – Programas – Macromedia – Hacer clic […]
25 diciembre, 2014
dreamweaver

El Panel de Objetos

El panel Objetos contiene botones para la creación e inserción de diversos tipos de objetos, como tablas, capas e imágenes. Para mostrar u ocultar el panel […]
25 diciembre, 2014
dreamweaver

Crear y editar marcos con DreamWeaver

A.- Planificar los marcos B.- Insertar marcos predefinidos a) Situar el punto de inserción en el documento previamente abierto b) A continuación, llevar a cabo una […]
25 diciembre, 2014
dreamweaver

Insertar imágenes, peliculas flash y videos en DreamWeaver

– En los documentos creados con Dreamweaver se pueden insertar: Imágenes con formato de archivo GIF, JPEG y PNG Películas Flash con formato de archivo SWF […]
25 diciembre, 2014
dreamweaver

Crear y Editar Tablas con DreamWeaver

  I.- EDITAR TABLAS EN VISTA ESTÁNDAR (Por defecto la página se abre en vista estándar) A.- CREAR UNA TABLA 1.- Para insertar una tabla en […]
25 diciembre, 2014
dreamweaver

Expresiones Regulares con DreamWeaver

De hecho lo que vamos a mostrar aquí sobre expresiones regulares se puede aplicar en muchos otros entornos (lenguajes de programación, programas, shells, etc) pero vamos […]
25 diciembre, 2014
dreamweaver

Editar código con DreamWeaver

Tarde o temprano tendremos que editar el código de nuestra web para insertar un contador, script, o algún otro código que nos hayan dado. Podemos hacerlo […]
25 diciembre, 2014
dreamweaver

Las Capas en DreamWeaver

Uno de los comportamientos más habitual e interesante es el de Mostrar-Ocultar capas. Resulta obvio que para poder aplicar este comportamiento han de existir capas en […]
25 diciembre, 2014
dreamweaver

Marquesinas en DreamWeaver

Las marquesinas son texto, imágenes, o una mezcla entre texto e imágenes, que pueden desplazarse de un lado a otro de la ventana en forma de […]
25 diciembre, 2014
dreamweaver

Creación de un menu desplegable en Dreamweaver

Creación de un menú desplegable en Dreamweaver   Muchas veces, nuestras páginas tienen tantos contenidos que si quisiéramos que apareciesen todos estos en un determinado lugar […]
25 diciembre, 2014
dreamweaver

Insertar Javascript en DreamWeaver

Llamar JavaScript Otro de los comportamientos que puede aplicarse sobre algún objeto es el de Llamar Javascript. Este comportamiento permite insertar código JavaScript dentro del código […]