Mostrar capas
Estoy creando una página y tengo un menu que al pasar por encima el ratón entra la imagen de sustitución pero quiero que a su vez aparezca una capa con unas direcciones, osea otro menu que se mantenga mientras desplazo el ratón y luego cierre al retirarlo, según los manuales me pide linea de tiempo tipo flax, también en comportamiento en mostrar-ocultar una vez señalada la imagen base, no la capa, en linea de tiempo no me aclaro bien y en la otra forma o bien se abre al pasar el ratón y no se cierra o al revés, ¿cómo lo puedo hacer? Y dos como puedo hacer que una ventana de exprorador tenga una medida determinada por. Ej 30x100 con un texto o el tamaño de una foto digamos 100x150 y no que se abra todo dejando la foto a un lado y lo demás en blanco.
1 Respuesta
Respuesta de juanceer
1
A mi modo de ver te convendría hacerlo con el comportamiento Mostrar-Ocultar Capas.
De esta manera:
Dibujas la capa (layer) donde quieres que aparezca (luego deberás ajustar la posición a mano por que cuando previsualizas seguro aparecerá más abajo).
Dentro de la capa pones el submenú, ya sea con texto o imágenes (te recomiendo una imagen mapeada), luego de esto, y suponiendo que usaste imágenes las seleccionas y haces un click en la ventana de Comportamientos, >> un click en "+" para agregar un comportamiento >> "Mostrar-Ocultar capas", te aparecerá el nombre de la capa que hiciste, y cliqueas en Ocultar.
Ahora teniendo seleccionada la imagen, te vas a la vista de código HTML (donde ves <> ) y en el código veras seleccionado el enlace a la imagen y antes dirá
<a href="#" onMouseOver="MM_showHideLayers
--- Y seguirá el código ---
--- Acá tienes que modificar donde dice onMouseOver y poner onMouseOut ------
- Esto lo tienes que hacer por cada imagen que tengas en la capa, si usaste texto haces un hipervínculo a # para agregar el comportamiento-
Luego seleccionas la capa, y en la ventana de propiedades, donde dice Vis (visualización) seleccionas "hidden", esto es para que la capa no se vea, es decir que queda como capa oculta.
Ahora ya la capa esta configurada como Oculta y las imágenes de adentro, con el comportamiento Ocultar capa.
Lo que quedaría seria, seleccionar en el menu principal el "boton" que deberá desplegar este submenú. Selecciona la imagen >> agregar comportamiento cliqueando en + >> Mostrar-Ocultar Capas y seleccionas la capa que hiciste y cliqueas en Mostrar.
Ahora si probas la página debería funcionar así, cuando pasas el mouse << OnMouseOver >> sobre el boton debería desplegar (mostrar) el submenu, y cuando sacas el mouse << onMouseOut >> deberia ocultarse.
Lo que debes tener muy en cuenta es que cuando termines de hacer el menu, es que deberás agregar en cada capa el comportamiento onMouseOut por cada capa que tengas con otros submenus, así te aseguraras de que nunca te quede más de un submenú "abierto".
Se que quizás parezca complicado, cualquier cosa me avisas.
---------------------------------------
Ahora vamos al tamaño de la ventana:
Aunque no se cuando o en base a que evento quieres que se abra la ventana, acá te explico como hacerlo al hacer click sobre una imagen y que esta se abra en una nueva ventana de tamaño configurado previamente por vos:
1ero. Seleccionas la imagen que quieres enlazar, (si es un texto como hipervínculo le pones el símbolo de numeral "#", es decir en lugar de poner lapagina.htm le pones solo # --si lo hiciste bien, lo marcara en azul y subrayará como cualquier link--, esto lo que hace es un hipervínculo a la misma página.)
Mantén seleccionada la imagen (o el texto), abrís la ventana de Comportamientos y cliqueas en el botón + para agregar un comportamiento >> cliqueas en Abrir Ventana del Explorador >> se abrirá una ventana donde configuras el tamaño, el nombre del archivo a enlazar y si quieres que aparezcan las barras de menú, de navegación, scroll, etc.
Ahora aquí, debes corregir código que Dreamweaver pone por default y que no corresponde.
Mantén seleccionado el enlace (ya sea la imagen o el texto desde donde se abrirá la ventana) y vé a la vista de código html. Ahí marcara solo el hipervínculo, dentro de lo seleccionado veras que dice:
onMouseOver="MM_openBrWindow
Y luego entre paréntesis el nombre de la página que enlazará
Pues bien, lo que debes corregir es donde dice onMouseOver reemplazarlo por onClick
De modo que quedara:
onClick="MM_openBrWindow y luego el nombre de tu pagina.
De esta manera se abrirá la ventana al hacer click y no al pasar el mouse sobre el enlac
De esta manera:
Dibujas la capa (layer) donde quieres que aparezca (luego deberás ajustar la posición a mano por que cuando previsualizas seguro aparecerá más abajo).
Dentro de la capa pones el submenú, ya sea con texto o imágenes (te recomiendo una imagen mapeada), luego de esto, y suponiendo que usaste imágenes las seleccionas y haces un click en la ventana de Comportamientos, >> un click en "+" para agregar un comportamiento >> "Mostrar-Ocultar capas", te aparecerá el nombre de la capa que hiciste, y cliqueas en Ocultar.
Ahora teniendo seleccionada la imagen, te vas a la vista de código HTML (donde ves <> ) y en el código veras seleccionado el enlace a la imagen y antes dirá
<a href="#" onMouseOver="MM_showHideLayers
--- Y seguirá el código ---
--- Acá tienes que modificar donde dice onMouseOver y poner onMouseOut ------
- Esto lo tienes que hacer por cada imagen que tengas en la capa, si usaste texto haces un hipervínculo a # para agregar el comportamiento-
Luego seleccionas la capa, y en la ventana de propiedades, donde dice Vis (visualización) seleccionas "hidden", esto es para que la capa no se vea, es decir que queda como capa oculta.
Ahora ya la capa esta configurada como Oculta y las imágenes de adentro, con el comportamiento Ocultar capa.
Lo que quedaría seria, seleccionar en el menu principal el "boton" que deberá desplegar este submenú. Selecciona la imagen >> agregar comportamiento cliqueando en + >> Mostrar-Ocultar Capas y seleccionas la capa que hiciste y cliqueas en Mostrar.
Ahora si probas la página debería funcionar así, cuando pasas el mouse << OnMouseOver >> sobre el boton debería desplegar (mostrar) el submenu, y cuando sacas el mouse << onMouseOut >> deberia ocultarse.
Lo que debes tener muy en cuenta es que cuando termines de hacer el menu, es que deberás agregar en cada capa el comportamiento onMouseOut por cada capa que tengas con otros submenus, así te aseguraras de que nunca te quede más de un submenú "abierto".
Se que quizás parezca complicado, cualquier cosa me avisas.
---------------------------------------
Ahora vamos al tamaño de la ventana:
Aunque no se cuando o en base a que evento quieres que se abra la ventana, acá te explico como hacerlo al hacer click sobre una imagen y que esta se abra en una nueva ventana de tamaño configurado previamente por vos:
1ero. Seleccionas la imagen que quieres enlazar, (si es un texto como hipervínculo le pones el símbolo de numeral "#", es decir en lugar de poner lapagina.htm le pones solo # --si lo hiciste bien, lo marcara en azul y subrayará como cualquier link--, esto lo que hace es un hipervínculo a la misma página.)
Mantén seleccionada la imagen (o el texto), abrís la ventana de Comportamientos y cliqueas en el botón + para agregar un comportamiento >> cliqueas en Abrir Ventana del Explorador >> se abrirá una ventana donde configuras el tamaño, el nombre del archivo a enlazar y si quieres que aparezcan las barras de menú, de navegación, scroll, etc.
Ahora aquí, debes corregir código que Dreamweaver pone por default y que no corresponde.
Mantén seleccionado el enlace (ya sea la imagen o el texto desde donde se abrirá la ventana) y vé a la vista de código html. Ahí marcara solo el hipervínculo, dentro de lo seleccionado veras que dice:
onMouseOver="MM_openBrWindow
Y luego entre paréntesis el nombre de la página que enlazará
Pues bien, lo que debes corregir es donde dice onMouseOver reemplazarlo por onClick
De modo que quedara:
onClick="MM_openBrWindow y luego el nombre de tu pagina.
De esta manera se abrirá la ventana al hacer click y no al pasar el mouse sobre el enlac
