Foros del Web » Creando para Internet » Herramientas y Software »

Problema con capas

 Estas en el tema de Problema con capas en el foro de Herramientas y Software en Foros del Web. Con el Dreamweaver MX 2004 he hecho dos capas en una página y quiero que un texto de un menú realize diferentes comportamientos con ellas: ...
  #1 (permalink)  
Antiguo 02/01/2005, 06:34
 
Fecha de Ingreso: abril-2004
Mensajes: 50
Antigüedad: 20 años
Puntos: 0
Problema con capas
Con el Dreamweaver MX 2004 he hecho dos capas en una página y quiero que un texto de un menú realize diferentes comportamientos con ellas:

1. Que al pasar con el puntero encima del texto se muestre y oculte la capa número 1 (donde he insertado una imagen). Lo consigo con "OnMouseOut"i "OnMouseOVer".

2. Que al hacer click en el mismo texto se muestre la capa 2 (donde he insertado texto). Lo consigo con "Onclick".

3. Que al hacer click en el mismo texto se muestre también la capa 1 (antes se mostraba y ocultaba al pasar el puntero por encima). Quiero que al hacer click se muestre y quede fijada ahi. He intentado aplicar otro comportamiento en "Onclick" y "mostrar" esa capa 1, pero no surte el efecto deseado.

Alguien puede ayudarme?
  #2 (permalink)  
Antiguo 02/01/2005, 22:33
Avatar de kahlito
Colaborador
  
Fecha de Ingreso: marzo-2003
Ubicación: En el Estrecho y el mar
Mensajes: 2.936
Antigüedad: 21 años, 1 mes
Puntos: 65
Hola joanrcp ¿puedes poner un ejemplo de lo que tienes?
  #3 (permalink)  
Antiguo 03/01/2005, 03:05
 
Fecha de Ingreso: abril-2004
Mensajes: 50
Antigüedad: 20 años
Puntos: 0
Imagina un menú:

. Colores
. Fotos
. Biografía

La intención sería que al pasar el puntero por encima de "Colores" apareciera a su derecha una capa con una foto y desapareciera luego; lo mismo al pasar el puntero por encima de "Fotos" i de "Biografía", aparecerían las respectivas capas con otras fotos. Esto ya lo se hacer (con el evento "OnMouseOn" i "OnMouseOver" y "mostrar-ocultar capas").

Pero imaginemos que me interesa abrir la sección "Biografía". Al pulsar encima de esta palabra con un click quiero que la imagen que antes se mostraba y ocultaba al pasar el puntero por encima quede ahora fija, que se muestre vaya. Y al mismo tiempo que se abra otra capa que contiene texto, debajo de esta primera. Tengo configurado el evento "Onclik" para que haga dos cosas: me abra la capa 1 y la capa 2, la de la foto y la de texto.

Lo que consigo es que se abra la segunda capa, la de texto. Pero lo que no me sale es que se muestre la primera, que quede ahí fija. Simplemente no aparece (sólo cuando paso el puntero por encima de "Biografia"). No se si me explico...
  #4 (permalink)  
Antiguo 06/01/2005, 09:48
Avatar de kahlito
Colaborador
  
Fecha de Ingreso: marzo-2003
Ubicación: En el Estrecho y el mar
Mensajes: 2.936
Antigüedad: 21 años, 1 mes
Puntos: 65
Hola de nuevo joanrcp, la verdad es que con el evento Onclick ya te deberia aparecer la capa Biografia....

Cuando te decia de poner un ejemplo me referia al código que utilizas, alomejor podemos ayudarte...
  #5 (permalink)  
Antiguo 06/01/2005, 16:30
 
Fecha de Ingreso: abril-2004
Mensajes: 50
Antigüedad: 20 años
Puntos: 0
Te mando el codigo. Hay dos tablas: en la de la izquierda está el menú con varios apartados (no son los mismos que en los ejemplos anteriores de los "color, fotos y biografía") y en la de la derecha es donde sitúo las capas. A ver como lo ves:

</head>

<body>
<table width="660" height="297" border="0">
<tr>
<td height="36" valign="top" bordercolor="1"><p class="menu2">Guia</p></td>
<td width="16" rowspan="17" valign="top" bordercolor="1">&nbsp;</td>
<td width="506" valign="top" bordercolor="1"><div id="sistemadejoc" style="position:absolute; width:333px; height:90px; z-index:1; visibility: hidden;"><img src="guia/imatges/arroba1.JPG" width="115" height="86" border="1"><span class="menu2">&nbsp;&nbsp;&nbsp; SISTEMA DE JOC </span></div>
<div id="creaunpersonatge" style="position:absolute; width:333px; height:90px; z-index:3; visibility: hidden;"><img src="guia/imatges/llapis.JPG" width="115" height="86" border="1"><span class="menu2">&nbsp;&nbsp;&nbsp; CREA UN PERSONATGE </span></div></td>
</tr>
<tr>
<td valign="top" bordercolor="1" class="menu" onClick="MM_showHideLayers('sistemadejoc','','show ','creaunpersonatge','','hide','creaunpersonatgete xt','','hide')" onMouseOver="MM_showHideLayers('sistemadejoc','',' show')" onMouseOut="MM_showHideLayers('sistemadejoc','','h ide')">. Sistema de joc </td>
<td valign="top" bordercolor="1">&nbsp;</td>
</tr>
<tr>
<td height="14" valign="top" bordercolor="1" class="menu" onClick="MM_showHideLayers('sistemadejoc','','show ')" onMouseOver="MM_showHideLayers('sistemadejoc','',' show')" onMouseOut="MM_showHideLayers('sistemadejoc','','h ide')">. Si ets nou/va</td>
<td valign="top" bordercolor="1">&nbsp;</td>
</tr>
<tr>
<td valign="top" bordercolor="1" class="menu" onClick="MM_showHideLayers('sistemadejoc','','show ')" onMouseOver="MM_showHideLayers('sistemadejoc','',' show')" onMouseOut="MM_showHideLayers('sistemadejoc','','h ide')"><span class="menu" onClick="MM_showHideLayers('sistemadejoc','','hide ','creaunpersonatge','','show','creaunpersonatgete xt','','show')" onMouseOver="MM_showHideLayers('creaunpersonatge', '','show')" onMouseOut="MM_showHideLayers('creaunpersonatge',' ','hide')">. Crea un personatge</span></td>
<td rowspan="14" valign="top" class="menu" onClick="MM_showHideLayers('creaunpersonatge','',' hide','creaunpersonatgetext','','hide','sistemadej oc','','show','sistemadejoctext','','show')" onMouseOver="MM_showHideLayers('sistemadejoc','',' show')" onMouseOut="MM_showHideLayers('sistemadejoc','','h ide')"><div id="creaunpersonatgetext" style="position:absolute; width:454px; height:223px; z-index:3; overflow: auto; visibility: hidden;">
<table width="433" border="0">
<tr>
<td width="427"><p>. Manual <span class="menunormal"> </span></p>
</td>
</tr>
</table>
<p>&nbsp;</p>
</div></td>
</tr>
<tr>
<td valign="top" bordercolor="1" class="menu" onClick="MM_showHideLayers('sistemadejoc','','show ')" onMouseOver="MM_showHideLayers('sistemadejoc','',' show')" onMouseOut="MM_showHideLayers('sistemadejoc','','h ide')">. Accions possibles</td>
</tr>
<tr>
<td valign="top" bordercolor="1" class="menu" onClick="MM_showHideLayers('sistemadejoc','','show ')" onMouseOver="MM_showHideLayers('sistemadejoc','',' show')" onMouseOut="MM_showHideLayers('sistemadejoc','','h ide')">. Evoluciona</td>
</tr>
  #6 (permalink)  
Antiguo 07/01/2005, 16:47
Avatar de kahlito
Colaborador
  
Fecha de Ingreso: marzo-2003
Ubicación: En el Estrecho y el mar
Mensajes: 2.936
Antigüedad: 21 años, 1 mes
Puntos: 65
Hola de nuevo joanrcp, la verdad es que me pierdo un poco en este código que has puesto, posiblemente tu problema sea que te coge el Onmouseover siempre que esta fuera....

Intenta hacerlo solo con Onclick a ver que tal te va
  #7 (permalink)  
Antiguo 30/06/2010, 11:58
Avatar de sychowaves  
Fecha de Ingreso: junio-2010
Ubicación: Caracas - Venezuela
Mensajes: 21
Antigüedad: 13 años, 9 meses
Puntos: 0
Respuesta: Problema con capas
Bien a veces las respuestas que sule hacer en los foros de un programador a otros son preguntas vacias sin embargo lo que deseas hacer con la con las acciones del mouse "OnMouseOut" "OnMouseOVer" no son factibles porque no estas usando la logica de la variable esto funcionara asi.... pillalo y comprenderas
Primero debes tener la funcion creada al inicio

de esta hay varias versiones pero esta es la que uso actualmente

<head>

Código Javascript: 
Ver original
  1. function MM_showHideLayers() { //  v9.0
  2.   var i,p,v,obj,args=MM_showHideLayers.arguments;
  3.   for (i=0; i<(args.length-2); i+=3) // Validar por cadena
  4.   with (document) if (getElementById && ((obj=getElementById(args[i]))!=null)) { v=args[i+2];
  5.     if (obj.style) { obj=obj.style; v=(v=='show')?'visible':(v=='hide')?'hidden':v; }
  6.     obj.visibility=v; }
  7. }
tu codigo al que agregaras en los posibles <a href"#" OnMouseOver=..... bla...bla..> sigiendo el ejemplo a continuacion

Aqui motrara la imagen 1 oculta la 2y3
OnMouseOVer="MM_showHideLayers('imagen_1','','show ','imagen_2','','hide','imagen_3','','hide')"

Aqui motrara la imagen 2 y oculta la 1y3
OnMouseOVer="MM_showHideLayers('imagen_1','','hide ','imagen_2','','show','imagen_3','','hide')"

Aqui motrara la imagen 2 y oculta la 1y2
OnMouseOVer="MM_showHideLayers('imagen_1','','hide ','imagen_2','','hideshow','imagen_3','','show')"

en las div deveran ir enunciadas asi para controlar las acciones

Código HTML: 
Ver original
  1. <div id="imagen_1>
  2. tu codigo</div>
  3. <div id="imagen_1>
  4. tu codigo</div>
  5. <div id="imagen_1>
  6. tu codigo</div>
si lo deseas en las css si no al principio del codigo como un style
Código CSS: 
Ver original
  1. #imagen_1
  2. {
  3. position:absolute;
  4.     top: 132px;
  5.     left: 2&#37;;
  6.     right: 2%;
  7.     width:95.6%;
  8.     Visibility: visible;
  9. }
  10. #imagen_2
  11. {
  12. position:absolute;
  13.     top: 132px;
  14.     left: 2%;
  15.     right: 2%;
  16.     width:95.6%;
  17.     Visibility: hidden;
  18. }
  19. #imagen_3
  20. {
  21. position:absolute;
  22.     top: 132px;
  23.     left: 2%;
  24.     right: 2%;
  25.     width:95.6%;
  26.     Visibility: hidden;
  27. }
asi iniciara con la primera imagen visible o no todo esta en como coloques la opcion de "Visibility"
Asi funcionara.... si trabajas con css Es mejor pues en dreamweaver te muestra visualmente las capas

Espero que sirva de algo el ejemplo
Última edición por sychowaves; 01/07/2010 a las 23:55 Razón: Complementar visualizacion en el foro
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta

SíEste tema le ha gustado a 1 personas


« Tema Anterior | Próximo Tema »


La zona horaria es GMT -6. Ahora son las 19:24.