Menú con imágenes en NVU
Vamos a crear un menú que tenga aspecto de edificio. La idea es que cada ventana tenga una opción diferente, aunque para simplificarlo en el ejemplo sólo habrá cuatro opciones.
Para ello, debemos comenzar por crear el dibujo completo de un edificio y guardarlo.
Luego, utilizando la misma herramienta de dibujo, debemos cortar la imagen en varios archivos (en Paint puede utilizarse la opción “Copiar a…” para grabar el sector seleccionado en un archivo). Las imágenes deben ser GIF o JPG.
Una vez que tengamos la imagen de cada opción en un archivo separado, abrimos el NVU y creamos una tabla utilizando el botón “Table” y moviendo el mouse “pintando” una tabla de 3 x 2.
En cada una de las celdas de la tabla insertaremos una imagen con cuidado de completar el “Alternate text” y el “Tool tip text” con un nombre para la opción correspondiente.
Una vez que tenemos la tabla vamos a intentar que sus bordes no se vean, presionando el botón derecho del mouse sobre el borde, y eligiendo “Table cell properties”.
Allí buscamos la pestaña “Table” y colocamos un cero en las tres opciones de “borders and spacing”. Esto hará que no se visualice ningún separador entre cada parte del dibujo.
Aquí debemos volver a las propiedades para que, regulando el ancho de cada columna (column) y fila (row), las imágenes cubran exactamente el tamaño de la celda, sin que queden bordes blancos. También puede lograrse eliminar un espacio en blanco por medio de la alineación (izquierda para la columna de la derecha o derecha para la primera columna)
Luego insertamos un vínculo en cada imagen utilizando la opción “Link” (podrán ser vínculos externos, internos, etc.)
Podemos ver el ejemplo resuelto en este vínculo.
Para ello, debemos comenzar por crear el dibujo completo de un edificio y guardarlo.
Luego, utilizando la misma herramienta de dibujo, debemos cortar la imagen en varios archivos (en Paint puede utilizarse la opción “Copiar a…” para grabar el sector seleccionado en un archivo). Las imágenes deben ser GIF o JPG.
Una vez que tengamos la imagen de cada opción en un archivo separado, abrimos el NVU y creamos una tabla utilizando el botón “Table” y moviendo el mouse “pintando” una tabla de 3 x 2.
En cada una de las celdas de la tabla insertaremos una imagen con cuidado de completar el “Alternate text” y el “Tool tip text” con un nombre para la opción correspondiente.
Una vez que tenemos la tabla vamos a intentar que sus bordes no se vean, presionando el botón derecho del mouse sobre el borde, y eligiendo “Table cell properties”.
Allí buscamos la pestaña “Table” y colocamos un cero en las tres opciones de “borders and spacing”. Esto hará que no se visualice ningún separador entre cada parte del dibujo.
Aquí debemos volver a las propiedades para que, regulando el ancho de cada columna (column) y fila (row), las imágenes cubran exactamente el tamaño de la celda, sin que queden bordes blancos. También puede lograrse eliminar un espacio en blanco por medio de la alineación (izquierda para la columna de la derecha o derecha para la primera columna)
Luego insertamos un vínculo en cada imagen utilizando la opción “Link” (podrán ser vínculos externos, internos, etc.)
Podemos ver el ejemplo resuelto en este vínculo.
0 Comments:
Publicar un comentario
<< Home