| Autor | Zpráva | ||
|---|---|---|---|
| matata8611 Profil |
#1 · Zasláno: 27. 11. 2015, 15:41:44
AHoj,
mohu poprosit: mám mapu <section class="no-padding hidden-print" id="portfolio">
<div class="container-fluid">
<div class="row no-gutter">
<div class="hidden-xs text-center">
<style >
#map-container {
width: 100%;
}
#map {
width: 100%;
height: 600px;
}
#map.full {
width: 100%;
height: 100%;
position:absolute
}
</style>
<div id="map-container"><div id="map"></div></div>
</div>
</div>
</div>
</section> Vše funguje, pokud section#portfolio skryji pomoci css a potom ho chci zobrazit <div class="well hidden text-center">
<a href="#portfolio" type="submit" title="Vyhledat" class="btn btn-primary page-scroll" id="mapbutton"><i class="fa fa-lg fa-map-o"></i> Zobrazit mapu</a>
<script>
jQuery( "#mapbutton" ).click(function() {
jQuery( "#portfolio" ).fadeIn();
});
</script>
</div> |
||
| Kcko Profil |
#2 · Zasláno: 27. 11. 2015, 16:25:21
Vyhod ji z toho CSS, které ji schovává a pokud ji potřebujes zobrazit až po kliku na button tak ji schovej javascriptem a pak tedy zobraz = neschovavej ji CSSkem ale Javascriptem po načtení ...
|
||
| matata8611 Profil |
#3 · Zasláno: 27. 11. 2015, 16:37:25
Presne to jsem už zkoušel. Resp. Tak se jsem pomoci js přidal po načtení #portfolio třídu hidden. Jak to udělat lépe prosim. Ideálně jQuery.
|
||
| Monkeys Profil * |
matata8611:
Skus zavolat po kliknuti funkciu initialize ktora sa stara o zobrazenie mapy. jQuery( "#mapbutton" ).click(function() {
jQuery( "#portfolio" ).fadeIn();
google.maps.event.addDomListener(window, 'click', initialize);
});neskusal som ale prve co ma napadlo. M. pripadne to mozes voalt aj z fadeIn neako takto: jQuery( "#mapbutton" ).click(function() {
jQuery( "#portfolio" ).fadeIn(function(){
google.maps.event.addDomListener(window, 'click', initialize);
});
}); |
||
| matata8611 Profil |
#5 · Zasláno: 28. 11. 2015, 01:00:29
bohuzel nefunguje..
mama skryti <script type="text/javascript">
jQuery(document).ready(function () {
jQuery("#portfolio").hide(); // just add this
});
</script>a zobrazeni <script>
jQuery( "#mapbutton" ).click(function() {
jQuery( "#portfolio" ).fadeIn(function(){
google.maps.event.addDomListener(window, 'click', initialize);
});
});
</script>ale porad se zobrazuje prazdny obdelnik bez mapy 
|
||
| Chamurappi Profil |
#6 · Zasláno: 28. 11. 2015, 02:58:08
Reaguji na matatu8611:
„pokud section#portfolio skryji pomoci css“ Jakým způsobem ho skrýváš? Mapové API si potřebuje změřit rozměry a element s display: none je má nulové.
Řešením je nepoužívat display: none, ale třeba visibility: hidden (s případným absolutním odpozicováním do tramtárie).
|
||
| matata8611 Profil |
#7 · Zasláno: 28. 11. 2015, 15:08:52
tak pokud dam portfolio
#portfolio {
visibility:hidden;
position:absolute;
}a js <script>
jQuery( "#mapbutton" ).click(function() {
jQuery("#portfolio").css("visibility", "visible");
jQuery("#portfolio").css("position", "relative");
});
</script>Tak se to zobrazi zase divne 
|
||
| joe Profil |
#8 · Zasláno: 29. 11. 2015, 09:39:38
Nech zobrazit mapu až tehdy, kdy ji bude uživatel potřebovat. Pokud ta akce je vázaná na stisk tlačítka, vytvářej mapu až při kliknutí.
Samozřejmě to jde udělat i teď jak to máš (viz níž), ale lepší je první varianta (načítáš mapu až tehdy, kdy ji opravdu potřebuješ). Stačí provést resize mapy google.maps.event.trigger(map, "resize"); |
||
|
Časová prodleva: 8 let
|
|||
0