Leaflet / Leaflet.fullscreen

A fullscreen control for Leaflet
http://leaflet.github.io/Leaflet.fullscreen/
ISC License
436 stars 117 forks source link

Keep inputs on top of the map #26

Closed sylvaincaillot closed 10 years ago

sylvaincaillot commented 10 years ago

Good morning, I am using the fullscreen plugin and really like it. For a specific project, i would need to keep some of my inputs (one date picker, 3 dropdown lists) on top of the full screen map. I tried to play with the z-index but got no success.

<div class="row-fluid">
                    <div class="span12">               
                        <div class="form-inline" id="MyForm">
                            <label class="control-label">Date4 </label>                                               
                            <input class="datepicker input-small form-control" id="Nb4" placeholder="Today" value="" type="text"/>

                            <label class="control-label" style="padding-left:10px;">Title1: </label>                                  
                            <select id="Nb1" class="input-medium form-control"></select>

                            <label class="control-label" style="padding-left:10px;">Title2: </label>                                  
                            <select id="Nb2" class="input-large form-control"></select> 

                            <label class="control-label" style="padding-left:10px;">Title3: </label>                                      
                            <select id="Nb3" class="input-medium form-control"></select>                             
                        </div> 
                    </div>          
                </div>

Any directions would be really welcome

Sylvain

jfirebaugh commented 10 years ago

You need to make sure that your inputs are children of the map element -- that's the element that's made full-screen, and the only thing that will be visible.