div sulla parte superiore del div con Google Maps API

Question

Come faccio galleggiare un "menu" div in cima alla mia Google Maps API "mappa" div. E forse possibile aggiungere una trasparenza del 50% sul menu div. Può essere fatto?

#map {width: 835px; height 540px; float: left;} 
#menu {width: 145px; float: right; padding-top: 10px;} 

<div id="map"></div> 
<div id="menu"></div> 

Answer 1

Non riesci a cambiare le posizioni del DIVs come questo:

<div id="menu"></div> 
<div id="map"></div> 

Se non si poteva andare qualcosa di simile:

<div id="map"></div> 
<div id="menu"></div> 

#menu 
{ 
    position: absolute; 
    top: 10px; /* adjust value accordingly */ 
    left: 10px; /* adjust value accordingly */ 
} 

Update 2

Cross- stile trasparenza browser:

.dropSheet 
{ 
    background-color: #000000; 
    background-image: none; 
    opacity: 0.5; 
    filter: alpha(opacity=50); 
} 

basta applicare la classe dropSheet per l'elemento che si desidera rendere trasparente.

Answer 2

Beh, la struttura di base di un galleggiante dovrebbe contenere un elemento di involucro che ha la proprietà posizione impostata a qualcosa di diverso da quello predefinito, e un elemento che cancella il galleggiante alla fine.
Così:

#wrapper { 
    position:relative; 
} 
#menu { 
    float:right; 
} 

<div id="wrapper"> 
    <div id="map"></div> 
    <div id="menu"></div> 
    <br clear="both" /> 
</div> 

Il codice fornito non è stato specificamente testato, ma il galleggiante e il fatto che il menu è lo strato superiore della mappa, dovrebbe rendere il menu sulla parte superiore della mappa in giusta lato. Per il problema della trasparenza, vedi this fantastic resource.

Spero che ti abbia aiutato.