Foros del Web » Creando para Internet » CSS »

Problema con posicionamiento absoluto en DW CS2

Estas en el tema de Problema con posicionamiento absoluto en DW CS2 en el foro de CSS en Foros del Web. [FONT="Lucida Console"] Buenas! Tengo un problema de posicionamiento absoluto PA de comportamientos de Dreamweaver CS2. El fin es pasar el cursor por los vinculos y ...
  #1 (permalink)  
Antiguo 27/02/2009, 17:53
Avatar de ViruSam  
Fecha de Ingreso: febrero-2009
Mensajes: 25
Antigüedad: 8 años, 9 meses
Puntos: 0
Problema con posicionamiento absoluto en DW CS2

[FONT="Lucida Console"]Buenas!

Tengo un problema de posicionamiento absoluto PA de comportamientos de Dreamweaver CS2.

El fin es pasar el cursor por los vinculos y al realizar esta acción ir visualizando las imagenes añadidas. Cuando quitas el cursor desaparece la imágen.

Creo haber realizado toda la configuración correctamente. Lo que he podido observar es que cambiando la propiedad del DIV del vinculo seleccionado en el atributo "backgroundcolor", al darle aceptar dichos cambios dreamweaver me lo cambia al atributo "style.fontFamily".

No se si puede derivar de este error pero no consigo que funcione. Haber si alguien puede resolverme esta incidencia.

Gracias
  #2 (permalink)  
Antiguo 27/02/2009, 18:24
Avatar de Calizman
Organiza competencias CSS
 
Fecha de Ingreso: octubre-2008
Ubicación: Ciudad de Guatemala, Guatemala
Mensajes: 1.122
Antigüedad: 9 años, 2 meses
Puntos: 83
Respuesta: Problema con posicionamiento absoluto en DW CS2

Saludos ViruSam!!

Creo que seria mas facil ayudarte si nos dieras el codigo HTMl y el CSS que estas usando, porque realmente no entiendo muy bien tu problema.

O si se te hace mas facil poner la url de tu pagina para que la veamos y podamos ver tu problema si?

Hasta Luego!!
__________________
[ Mi Sitio Personal ]
"La felicidad no es una estacion de llegada... Es un modo de viajar"
Tom Schreiter
  #3 (permalink)  
Antiguo 02/03/2009, 12:09
Avatar de ViruSam  
Fecha de Ingreso: febrero-2009
Mensajes: 25
Antigüedad: 8 años, 9 meses
Puntos: 0
Respuesta: Problema con posicionamiento absoluto en DW CS2

ok, el caso es que aún no tengo un hosting donde almacenar los archivos de la web y estoy trabajando de forma local.
Como puedo pasartelo para que lo visualices?
  #4 (permalink)  
Antiguo 02/03/2009, 13:58
Avatar de Calizman
Organiza competencias CSS
 
Fecha de Ingreso: octubre-2008
Ubicación: Ciudad de Guatemala, Guatemala
Mensajes: 1.122
Antigüedad: 9 años, 2 meses
Puntos: 83
Respuesta: Problema con posicionamiento absoluto en DW CS2

Puedes copiar y pegar el codigo que tienes aqui mismo
__________________
[ Mi Sitio Personal ]
"La felicidad no es una estacion de llegada... Es un modo de viajar"
Tom Schreiter
  #5 (permalink)  
Antiguo 02/03/2009, 15:03
Avatar de ViruSam  
Fecha de Ingreso: febrero-2009
Mensajes: 25
Antigüedad: 8 años, 9 meses
Puntos: 0
Respuesta: Problema con posicionamiento absoluto en DW CS2

aqui va:


<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Pixel in fact </title>
<meta name="keywords" content=
"video creation, live visuals graphics">
<link href="estilos css pixel.css" rel="stylesheet" type="text/css">
<style type="text/css">
<!--
a:link {
text-decoration: none;
}
a:visited {
text-decoration: none;
color: #FFFFFF;
}
a:hover {
text-decoration: none;
color: #FFFFFF;
}
a:active {
text-decoration: none;
color: #FFFFFF;
}
-->
</style>
<script type="text/JavaScript">
<!--
function MM_findObj(n, d) { //v4.01
var p,i,x; if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
if(!x && d.getElementById) x=d.getElementById(n); return x;
}

function MM_changeProp(objName,x,theProp,theValue) { //v6.0
var obj = MM_findObj(objName);
if (obj && (theProp.indexOf("style.")==-1 || obj.style)){
if (theValue == true || theValue == false)
eval("obj."+theProp+"="+theValue);
else eval("obj."+theProp+"='"+theValue+"'");
}
}
//-->
</script>
</head>

<body>
<div class="contenedor">
<div class="encabezado">
<div class="Fuente1">Pixel in Fact <span class="fuente2">Video Creation & Live Visuals Graphics</span></div>
</div>
<div class="menu-navegador">
<div class="div-menu">
<a href="#" onClick="MM_changeProp('pi1','','visibility','visi ble','DIV')" onMouseOver="MM_changeProp('pi1','','visibility',' hidden','DIV')">Biografia</a></div>
<div class="div-menu">
<a href="#" onClick="MM_changeProp('pi2','','visibility','visi ble','DIV');MM_changeProp('pi2','','visibility','h idden','DIV')">Video creaci&oacute;n </a></div>
<div class="div-menu">
<a href="#" onClick="MM_changeProp('pi3','','visibility','visi ble','DIV')" onMouseOver="MM_changeProp('pi3','','visibility',' hidden','DIV')">Imagenes </a></div>
<div class="div-menu">
<a href="#">Calendario </a></div>
<div class="div-menu">
<a href="#">Links</a></div>
<div class="div-menu">
<a href="#">Contacto</a></div>
</div>

<!--A partir de aqui pruebas de maquetacion flash-->

<div class="principal">Colocar aquí el contenido para class "principal"</div>
<div class="submenu">
<div class="celda-submenu">
<div class="pi1" id="pi1">
<p><a href="#"> Live Vs </a></p>
<p><a href="#"> Biografia</a></p>
<p><a href="#"> CV artistico </a></p>
</div></div>
<div class="celda-submenu">
<div class="pi2" id="pi2">
<p> <a href="#">Bobina de trabajos </a></p>
<p><a href="#"> Video arte </a></p>
<p><a href="#"> Live sessions </a></p>
</div></div>
<div class="celda-submenu">
<div class="pi3" id="pi3">
<p><a href="#"> Fotografias</a> </p>
<p><a href="#">Fotogranmas </a> </p>
</div>
</div>
</div>
</div>
</body>
</html>
  #6 (permalink)  
Antiguo 02/03/2009, 15:04
Avatar de ViruSam  
Fecha de Ingreso: febrero-2009
Mensajes: 25
Antigüedad: 8 años, 9 meses
Puntos: 0
Respuesta: Problema con posicionamiento absoluto en DW CS2

y aqui la hoja de estilos CSS:

body {
background-color: #000000;
text-align: center;
margin: 0px;
padding: 0px;
}
.contenedor {
font-family: "Lucida Console";
background-color: #000000;
margin-right: auto;
margin-left: auto;
height: 600px;
width: 1000px;
border: 1px solid #FFFFFF;
margin-top: 150px;
margin-bottom: 150px;
font-size: 12px;
color: #FFFFFF;
}
.principal {
margin: 0px;
padding: 0px;
float: right;
height: 520px;
width: 845px;
border: 1px solid #FF0000;
}

.encabezado {
background-color: #000000;
height: 40px;
border-top-width: 1px;
border-right-width: 1px;
border-bottom-width: 1px;
border-left-width: 1px;
border-bottom-style: solid;
border-top-color: #FFFFFF;
border-right-color: #FFFFFF;
border-bottom-color: #FFFFFF;
border-left-color: #FFFFFF;
text-decoration: none;
}
.fuente2 {
font-family: "Lucida Console";
font-size: 12px;
color: #999999;
text-decoration: none;
text-align: right;
}

.div-menu {
font-family: "Lucida Console";
font-size: 12px;
line-height: 20px;
color: #FFFFFF;
background-color: #000000;
text-align: center;
padding: 1px;
width: 115px;
float: left;
border-top-width: 1px;
border-right-width: 1px;
border-bottom-width: 1px;
border-left-width: 1px;
border-right-style: solid;
border-top-color: #FFFFFF;
border-right-color: #FFFFFF;
border-bottom-color: #FFFFFF;
border-left-color: #FFFFFF;
}
.submenu {
margin: 0px;
padding: 0px;
width: 150px;
border: 1px solid #FF0000;
float: left;
}
.celda-submenu {
width: 145px;
padding: 0px;
height: 80px;
border: 1px solid #FFFFFF;
text-align: left;
margin-top: 2px;
}
.pi1 {
background-image: url(pi2.gif);
height: 80px;
width: 145px;
position: absolute;
visibility: hidden;
}


a:link {
font-family: "Lucida Console";
font-size: 10px;
color: #FFFFFF;
text-decoration: none;
background-color: #000000;
}
.menu-navegador {
background-color: #000000;
text-align: left;
margin: 0px;
padding: 5px;
height: 20px;
float: left;
}
.Fuente1 {
font-family: "Lucida Console";
font-size: 16px;
color: #999999;
background-color: #000000;
text-align: left;
line-height: 40px;
}
.pi2 {

background-image: url(pi2.gif);
height: 80px;
width: 145px;
position: absolute;
visibility: hidden;
}
.pi3 {
background-image: url(pi2.gif);
height: 80px;
width: 145px;
position: absolute;
visibility: hidden;
}
  #7 (permalink)  
Antiguo 02/03/2009, 15:07
Avatar de ViruSam  
Fecha de Ingreso: febrero-2009
Mensajes: 25
Antigüedad: 8 años, 9 meses
Puntos: 0
Respuesta: Problema con posicionamiento absoluto en DW CS2

Sq antes estaba insertando un vinculo de una direccion web y me generaba un error de anti-spam que no habia visto y no me dejaba enviartelo desde "foros del web".
Solucionado.

Ya me diras.

Como veras solo he comenzado con la parte del navegador pero no quiero continuar hasta solucionar esto.
De lo contrario pasaría a realizarlo con Flash que de esta forma si sé, pero me gustaria desarrollarlo integramente con HTML y CSS.

Saludos y Gracias
  #8 (permalink)  
Antiguo 02/03/2009, 15:31
Avatar de Calizman
Organiza competencias CSS
 
Fecha de Ingreso: octubre-2008
Ubicación: Ciudad de Guatemala, Guatemala
Mensajes: 1.122
Antigüedad: 9 años, 2 meses
Puntos: 83
Respuesta: Problema con posicionamiento absoluto en DW CS2

y el evento hover donde lo tienes? porque no lo veo por ninguna parte...

Para que pase lo que dices, tienes que poner el evento hover en el cuadro donde deseas verlo, tal y como esta en Esta Web en la seccion Rollover.

Espero te sirva!! Hasta Luego!!
__________________
[ Mi Sitio Personal ]
"La felicidad no es una estacion de llegada... Es un modo de viajar"
Tom Schreiter
  #9 (permalink)  
Antiguo 02/03/2009, 17:24
Avatar de ViruSam  
Fecha de Ingreso: febrero-2009
Mensajes: 25
Antigüedad: 8 años, 9 meses
Puntos: 0
Respuesta: Problema con posicionamiento absoluto en DW CS2

He creado el evento a:hover que me faltaba pero sigue sin funcionarme.

Mira te paso un ejemplo de lo q busco exactamente:


<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Documento sin t&iacute;tulo</title>
<link href="estilos css ciudades.css" rel="stylesheet" type="text/css">
<script type="text/javascript">
<!--
function MM_changeProp(objId,x,theProp,theValue) { //v9.0
var obj = null; with (document){ if (getElementById)
obj = getElementById(objId); }
if (obj){
if (theValue == true || theValue == false)
eval("obj.style."+theProp+"="+theValue);
else eval("obj.style."+theProp+"='"+theValue+"'");
}
}

function MM_findObj(n, d) { //v4.01
var p,i,x; if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
if(!x && d.getElementById) x=d.getElementById(n); return x;
}
//-->
</script>
</head>

<body>
<div class="contenedor">
<div class="encabezado"><span class="h2">Ejercicio de comportamientos con Divs</span>
<span class="h1">Elige tu ciudad favorita!</span></div>
<div class="navegador"><a href="#" onMouseOver="MM_changeProp('paris','','visibility' ,'visible','DIV')" onMouseOut="MM_changeProp('paris','','visibility', 'hidden','DIV')">Paris</a> <a href="#" onMouseOver="MM_changeProp('amsterdan','','visibil ity','visible','DIV')" onMouseOut="MM_changeProp('amsterdan','','visibili ty','hidden','DIV')">Amsterdan</a> <a href="#" onMouseOver="MM_changeProp('london','','visibility ','visible','DIV')" onMouseOut="MM_changeProp('london','','visibility' ,'hidden','DIV')">London</a> <a href="#" onMouseOver="MM_changeProp('bruselas','','visibili ty','visible','DIV')" onMouseOut="MM_changeProp('bruselas','','visibilit y','hidden','DIV')">Bruselas</a> <a href="#" onMouseOver="MM_changeProp('moscu','','visibility' ,'visible','DIV')" onMouseOut="MM_changeProp('moscu','','visibility', 'hidden','DIV')">Moscu</a></div>

<div class="paris" id="paris"></div>

<div class="amsterdan" id="amsterdan"></div>

<div class="london" id="london"></div>

<div class="bruselas" id="bruselas"></div>

<div class="moscu" id="moscu"></div>
</div>
</body>
</html>

Y la hoja estilos CSS:

@charset "utf-8";
body {
text-align: center;
margin: 0px;
padding: 0px;
}
a {
color: #333333;
text-decoration: none;
}
a:hover {
color: #FFFFFF;
background-color: #FF0000;
}

.contenedor {
width: 500px;
margin-right: auto;
margin-left: auto;
border: 1px solid #000000;
padding: 5px;
height: 300px;
text-align: left;
}
.paris {
font-family: Arial, Helvetica, sans-serif;
background-image: url(imagenes/7dep_paris.jpg);
height: 200px;
width: 200px;
margin-top: 5px;
position: absolute;
visibility: hidden;
}


.navegador {
font-family: Arial, Helvetica, sans-serif;
font-size: 14px;
color: #333333;
text-align: left;
height: auto;
}
.encabezado {
font-family: Arial, Helvetica, sans-serif;
text-align: left;
border-top-width: 3px;
border-right-width: 3px;
border-bottom-width: 3px;
border-left-width: 3px;
border-bottom-style: solid;
border-bottom-color: #FF0000;
height: 40px;
}
.h2 {
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
color: #333333;
text-align: right;
float: right;
line-height: 30px;
}
.h1 {
font-family: Arial, Helvetica, sans-serif;
font-size: 18px;
line-height: 30px;
color: #000000;
text-align: left;
}
.amsterdan {
font-family: Arial, Helvetica, sans-serif;
background-image: url(imagenes/amsterdan.jpg);
height: 200px;
width: 200px;
margin-top: 5px;
position: absolute;
visibility: hidden;
}
.london {
font-family: Arial, Helvetica, sans-serif;
background-image: url(imagenes/london.jpg);
height: 200px;
width: 200px;
margin-top: 5px;
position: absolute;
visibility: hidden;
}
.bruselas {
font-family: Arial, Helvetica, sans-serif;
background-image: url(imagenes/Bruselas-Grand-Place.jpg);
height: 200px;
width: 200px;
margin-top: 5px;
position: absolute;
visibility: hidden;
}
.moscu {
font-family: Arial, Helvetica, sans-serif;
background-image: url(imagenes/Moscu.jpg);
height: 200px;
width: 200px;
margin-top: 5px;
position: absolute;
visibility: hidden;
}
  #10 (permalink)  
Antiguo 02/03/2009, 18:25
Avatar de Calizman
Organiza competencias CSS
 
Fecha de Ingreso: octubre-2008
Ubicación: Ciudad de Guatemala, Guatemala
Mensajes: 1.122
Antigüedad: 9 años, 2 meses
Puntos: 83
Respuesta: Problema con posicionamiento absoluto en DW CS2

Si eso es lo que buscas, porque no usas eso? y solo lo modificas a tu antojo eh?
__________________
[ Mi Sitio Personal ]
"La felicidad no es una estacion de llegada... Es un modo de viajar"
Tom Schreiter
  #11 (permalink)  
Antiguo 03/03/2009, 05:28
Avatar de ViruSam  
Fecha de Ingreso: febrero-2009
Mensajes: 25
Antigüedad: 8 años, 9 meses
Puntos: 0
Respuesta: Problema con posicionamiento absoluto en DW CS2

Precisamente este es un ejercicio de unas clases que realicé de Dreamweaver. Trabajabamos con CS3 y en casa trabajo con CS2. Probé de hacerlo identicamente con CS2 y no me funcionó.
Incluso copiando el código y el CSS al CS2 tampoco.
Aquí comenzaron a venir mis dudas. Parece extraño pero es así. Pienso que quizas hasta pueda ser mi licencia. Nose, de hecho voy a probarlo de nuevo con un CS3. No tendría xq pero probaré.
Si lo soluciono ya te diré.
Gracias por la ayuda prestada.

Saludos
  #12 (permalink)  
Antiguo 03/03/2009, 09:59
Avatar de ViruSam  
Fecha de Ingreso: febrero-2009
Mensajes: 25
Antigüedad: 8 años, 9 meses
Puntos: 0
Respuesta: Problema con posicionamiento absoluto en DW CS2

Buenas Calizzz!

Veo que el problema está en el apartado de Java Script:
Copiando y pegando el que hice con CS3 me funciona
Te marcado en negrita las versiones ya que al realizarlo en CS2 eran diferentes.:


<script type="text/javascript">
<!--
function MM_changeProp(objId,x,theProp,theValue) { //v9.0 var obj = null; with (document){ if (getElementById)
obj = getElementById(objId); }
if (obj){
if (theValue == true || theValue == false)
eval("obj.style."+theProp+"="+theValue);
else eval("obj.style."+theProp+"='"+theValue+"'");
}
}

function MM_findObj(n, d) { //v4.01 var p,i,x; if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
if(!x && d.getElementById) x=d.getElementById(n); return x;
}
//-->
</script>
  #13 (permalink)  
Antiguo 03/03/2009, 12:58
Avatar de Calizman
Organiza competencias CSS
 
Fecha de Ingreso: octubre-2008
Ubicación: Ciudad de Guatemala, Guatemala
Mensajes: 1.122
Antigüedad: 9 años, 2 meses
Puntos: 83
Respuesta: Problema con posicionamiento absoluto en DW CS2

Ok! entonces eso quiere decir que has resuelto tu problema????

Disculpa que no te pueda ayudar de una gran manera, pero realmente me costo mucho entender lo que querias... pero si solucionaste tu problema, me quedo satisfecho!!

Hasta Luego!!
__________________
[ Mi Sitio Personal ]
"La felicidad no es una estacion de llegada... Es un modo de viajar"
Tom Schreiter
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




La zona horaria es GMT -6. Ahora son las 05:56.