Superponer un Div en un mapa de google

trent34 · #1 (**permalink**) 07/04/2011, 02:24

Hola Buenas! Ando adaptando un mapa de google a mi web has que se me ha presentado el siguiente problema.

Trato de superponer un campo input de un formulario asi como un boton encima del mapa, pero no lo consigo, siempre se me queda el mapa encima y el campo no se ve, he probado con varias cosas pero no lo he conseguido, y tampoco encuentro demasiada informacion. Mi pregunta es si es posible realizarse y si me podrian dar una orientacion.

Muchas Gracias. Salu2

abimaelrc · #2 (**permalink**) 07/04/2011, 05:27

Debes colocar el div que añades el mapa arriba y luego el div del formulario. Algo así

Código HTML:

Ver original<!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>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <title>test</title>
    <style>
    *{ margin: 0; padding: 0; }
    html, body, #map{
        width: 100%;
        height: 100%;
    }
    #formContent{
        position: relative;
        top: -50px;
        width: 300px;
        margin: 0 auto;
    }
    .submit{ padding: 3px 5px; }
    </style>
    <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false&amp;language=es"></script>
    <script type="text/javascript">
    window.onload = function(){
        var popup;
        var n=1;
        var options = {
            zoom: 9
            , center: new google.maps.LatLng(18.2, -66.5)
            , mapTypeId: google.maps.MapTypeId.ROADMAP
        };
     
        var map = new google.maps.Map(document.getElementById('map'), options);
    };
    </script>
</head>
<body>
    <div id="map"></div>
    <div id="formContent">
        <form action="#">
            <input type="text" name="foo" />
            <input type="submit" class="submit" value="submit" />
        </form>
    </div>
</body>
</html>

trent34 · #3 (**permalink**) 07/04/2011, 05:34

Muchisimas Gracias abimaelrc va perfecto!!