Sv Community El Salvador

Soporte y Tecnología => Diseño & Webmaster Corner => Mensaje iniciado por: Phsyckr en octubre 30, 2007, 11:09:56 am

Título: ¿iframe con tamaño variable?
Publicado por: Phsyckr en octubre 30, 2007, 11:09:56 am
Hola estimados amig@s, hoy vengo a pedirles de nuevo (como ya es rutina xD) su valiosa y super ayuda:

Bueno tengo un iframe de un mapa de google maps pero el problema es que mi sitio esta hecho con divs de tamaño fluido y se adaptan a la resolucion de la pantalla pero el mapa se me queda fuera con resoluciones de 800*600 y pues no me gusta como se ve si  le cambio el tamaño para que quede cabal, no se si alguna forma de presentar el mapa ya sea en iframe, pero si se pudede que se adapte a el tamaño al igual que las demas divs
Título: Re: ¿iframe con tamaño variable?
Publicado por: mxgxw en octubre 30, 2007, 11:16:22 am
Hola estimados amig@s, hoy vengo a pedirles de nuevo (como ya es rutina xD) su valiosa y super ayuda:

Bueno tengo un iframe de un mapa de google maps pero el problema es que mi sitio esta hecho con divs de tamaño fluido y se adaptan a la resolucion de la pantalla pero el mapa se me queda fuera con resoluciones de 800*600 y pues no me gusta como se ve si  le cambio el tamaño para que quede cabal, no se si alguna forma de presentar el mapa ya sea en iframe, pero si se pudede que se adapte a el tamaño al igual que las demas divs


Solo cambia el stylesheet del div que contiene el mapa:

Código: [Seleccionar]
#map { height: 100%; width: 100%; padding: 0px; margin: 0px; background: black}

El div que tiene el mapa se llama map, de ahi tenes que meterlo dentro del div del contenido. Con eso debería de redimensionarse adecuadamente.

Aquí en el trabajo hicimos un cosito de esos a pantalla completa:

http://www.snet.gob.sv/googlemaps/fullscreen.htm
Título: Re: ¿iframe con tamaño variable?
Publicado por: Phsyckr en octubre 30, 2007, 11:35:27 am
Solo cambia el stylesheet del div que contiene el mapa:

Código: [Seleccionar]
#map { height: 100%; width: 100%; padding: 0px; margin: 0px; background: black}

El div que tiene el mapa se llama map, de ahi tenes que meterlo dentro del div del contenido. Con eso debería de redimensionarse adecuadamente.

Aquí en el trabajo hicimos un cosito de esos a pantalla completa:

http://www.snet.gob.sv/googlemaps/fullscreen.htm

mmm ahorita esta fuera de linea lo snet.gob.sv

pero bueno no se si esq no te he entendido o que pero osea solo creo un div que use el 100% de el div que lo contiene, aja pero los mapas de googlemaps se cargan mediante iframes. y el iframe se sale de el div en lugar de ridemencionarse
Título: Re: ¿iframe con tamaño variable?
Publicado por: Phsyckr en octubre 30, 2007, 01:00:27 pm
Bien ya probe y ya hise todo

el HTML:
Citar
<head>
<link href="css/barrios.css" rel="stylesheet" type="text/css" />
<script src="http://maps.google.com/maps?file=api&v=1&key=ABQIAAAASs-w2HUBjKGeGCext3AO-BTMK0RZgL4gsjjzaVFbOHe1O_m-UhTaNULOiubErKsDCkkwDhSA5mD31w" type="text/javascript"></script>
</head>

<body class="Contenido">
<div id="map-out">
<div id="map"></div></div>
<script type="text/javascript">
    //<![CDATA[
    window.onload = showMap;
    function showMap()
{
    var map = new GMap(document.getElementById("map"));
    map.addControl(new GSmallMapControl());
    map.centerAndZoom(new GPoint(-88.270694, 13.765751), 4);
    }
    //]]>
    </script>
me quedo asi luego esto lo incluyo mediante un include a la pagina en la quiero que se vea pero me queda como sobe puesto a los demas divs y ademas no se ve el mapa nomas los controles
y el css me queda asi:
Citar
#map { height: 100%;
       width: 100%;
       padding: 0px;
      margin: 0px;
      background: black;
      
     }
    
Título: Re: ¿iframe con tamaño variable?
Publicado por: Phsyckr en octubre 30, 2007, 01:33:56 pm
auto respuesta:

Jajaja esque no havia fijade que a el div le habia puesto heigth:100% a la div que contiene el div del mapa solo tenia que ponerle un tamaña establecido, claro siempre dejando en width:100%, para que se adapte. a la div madre digamoslo asi y esta se adapte a la resolucion