Foros del Web » Creando para Internet » CSS »

Div no se muestra como deberia en IE :/

Estas en el tema de Div no se muestra como deberia en IE :/ en el foro de CSS en Foros del Web. Holas gente en esta pagina : http://www.locualo.net/programacion/.../00000024.aspx ponen un ejemplo del tipico cargando datos, como lo hace gmail, en firefox me va delujo pero en ...
  #1 (permalink)  
Antiguo 25/09/2008, 11:28
Avatar de kaninox  
Fecha de Ingreso: septiembre-2005
Ubicación: In my House
Mensajes: 3.591
Antigüedad: 12 años, 3 meses
Puntos: 49
Div no se muestra como deberia en IE :/

Holas gente en esta pagina : http://www.locualo.net/programacion/.../00000024.aspx

ponen un ejemplo del tipico cargando datos, como lo hace gmail, en firefox me va delujo pero en el famoso IE - 7 en mi caso se muestra a lo largo, funcionalmente funciona desaparece al cargar la web pero no logro hacer que se vea como se me ve en firefox, a la derecha sobre la web al desplazarme, este queda arriba y se quita cuando se completa la carga....

solucion?????

edito : he visto que si pongo position : absolute me va pero no se fixa :P
como puedo poner ambas :/
__________________
Gokuh Salvo al mundo. PUNTO!!!!

Última edición por kaninox; 25/09/2008 a las 13:10
  #2 (permalink)  
Antiguo 27/09/2008, 20:21
 
Fecha de Ingreso: octubre-2004
Mensajes: 289
Antigüedad: 13 años, 2 meses
Puntos: 10
Respuesta: Div no se muestra como deberia en IE :/

Hola kaninox

Lo que ocurre con ie6 es que no interpreta el valor fixed.

Copia y prueba la siguiente página y verás que de esta forma funciona correctamente en ie6, ie7, firefox y opera.

(El contenido del iframe es una página de carga lenta -la portada de un periódico- para poder testar el javascript)

Saludos

Código HTML:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Ejemplo</title>
<script language="javascript" type="text/javascript">
//<![CDATA[
function Oculta() {
document.getElementById("cargando").style.display = "none";
}
//]]>
</script>
<style type="text/css">
#cargando {
	position: absolute;
	top: 3px;
	right: 3px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size:11px;
	padding: 4px;
	background-color:#CC0000;
	color:#FFFFFF;
	font-weight:bold;
}
</style>
</head>
<body onload="Oculta()">
<div id="cargando">Cargando...</div>
<!-- esta carga del iframe es para poder testar la precarga-->
<center>
<iframe name="muestra" src="http://www.elpais.com" height="450" width="600" border="0" frameborder="0"></iframe>
</center>
</body>
</html> 
  #3 (permalink)  
Antiguo 27/09/2008, 20:46
 
Fecha de Ingreso: octubre-2004
Mensajes: 289
Antigüedad: 13 años, 2 meses
Puntos: 10
Respuesta: Div no se muestra como deberia en IE :/

Hola de nuevo, releyendo tu post no había entendido bien el que la leyenda se quedara fija aunque se hiciera scroll.

Aquí te dejo eso arreglado. Funciona en ie6 (sí también en el 6 ), ie7, ff y opera.

Código HTML:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Ejemplo</title>
<script language="javascript" type="text/javascript">
//<![CDATA[
function Oculta() {
document.getElementById("cargando").style.display = "none";
}
//]]>
</script>

<style>
#cargando{ 
	position:fixed; right:3px; top:3px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size:11px;
	background-color:#CC0000;
	color:#FFFFFF;
	font-weight:bold;
	padding: 3px;
}	
</style>
<!--[if lt IE 7]> 
<style>
#cargando{ 
	position:absolute;
	top:0;
	top: expression((ignorar = 3+document.documentElement.scrollTop+document.body.scrollTop) + 'px' );
}
</style>
<![endif]-->


</head>
<body onload="Oculta()">
<div id="cargando">Cargando...</div>
<!-- esta carga del iframe es para poder testar la precarga-->
<center>
<iframe name="muestra" src="http://www.elpais.com" height="450" width="600" border="0" frameborder="0"></iframe>
</center>
<br />
<!-- este divisor es para poder hacer scroll y probar la fijación de la leyenda de precarga -->
<div style="width: 100%; height: 1000px" align="center">Esta capa es para poder hacer scroll</div>
</body>
</html> 
  #4 (permalink)  
Antiguo 01/10/2008, 19:27
Avatar de kaninox  
Fecha de Ingreso: septiembre-2005
Ubicación: In my House
Mensajes: 3.591
Antigüedad: 12 años, 3 meses
Puntos: 49
Respuesta: Div no se muestra como deberia en IE :/

pues si habia visto esa solucion :/ pero tampoco va bien en IE...
pero les dejo la solucion :D es solo modificar la CSS un poco

Código:
#cargandowait {
padding-left:2px; padding-right:2px; background-color:#CC0000; color:#FFFFFF; font-weight:bold;
left:3px; top:3px; position:fixed; _position:absolute; _top:expression(eval(document.body.scrollTop));
}
__________________
Gokuh Salvo al mundo. PUNTO!!!!
  #5 (permalink)  
Antiguo 02/10/2008, 09:09
 
Fecha de Ingreso: octubre-2004
Mensajes: 289
Antigüedad: 13 años, 2 meses
Puntos: 10
Respuesta: Div no se muestra como deberia en IE :/

Hola kaninox

El problema es que tu solución no funciona en ie6 -al hacer scroll el div se desplaza- (el navegador más usado actualmente).

He vuelto a comprobar mi propuesta y FUNCIONA perfectamente en ie6, ie7, ff y opera. No comprendo porqué dices que no te funciona en iexplorer.

Saludos
  #6 (permalink)  
Antiguo 02/10/2008, 16:04
Avatar de kaninox  
Fecha de Ingreso: septiembre-2005
Ubicación: In my House
Mensajes: 3.591
Antigüedad: 12 años, 3 meses
Puntos: 49
Respuesta: Div no se muestra como deberia en IE :/

mmmm a mi no me anduvo vamos a probarla nuevamente se agradece el interes :D
__________________
Gokuh Salvo al mundo. PUNTO!!!!
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 23:25.