Business
Jobs
  • About Us
  • Solutions
    • Job Postings
      Post your job and receive qualified candidates in 48h.
    • Candidate Assessments
      500+ technical and psychological tests, plus anti-fraud.
    • Headhunting
      Tailor-made executive search from start to finish.
    • Payroll + EOR
      Payroll dispersal and EOR across 15+ LATAM countries.
  • Pricing
  • Jobs

0

187
Views
Leaflet Fullscreen

I use the framework codeigniter3
bootrsap 5 called in header.php
Leaflet map cdn (in view)
leaflet.fullscreen cdn (in view)
jquery cdn (in view)

1st step in mode fullscreen off (worked fine)

<script>
 $("#map").css('z-index', 0);
 $(".sidebar").css('position', 'absolute')
 $(".sidebar").css('z-index', 1);
 $(".sidebar").draggable();
 $(".card-header-sidebar").css('cursor', 'grab');
</script>

when i change fullscreen ok ( my problem )

i want to keep the sidebar visible

Full screen off
full screen on

about 4 years ago · Santiago Trujillo
1 answers
Answer question

0

There are no solution for fullscreen leaflet with extern html content
Other adapted solution:
Add class hidden to sidebar ( Html element )

Create Legend on map

const legend = L.control({
  position: "topleft"
});

Get html content

const legend_html = $('#sidebar').html()

Add this to map

legend.onAdd = function() {
  let div = L.DomUtil.create("div", "leaflet-legend");
  L.DomEvent.disableClickPropagation(div);
  div.insertAdjacentHTML("beforeend", legend_html);
  return div;
};
legend.addTo(map);

Fullscreen result

about 4 years ago · Santiago Trujillo Report
Answer question
Find remote jobs

Discover the new way to find a job!

Top jobs
Top job categories
Business
Post vacancy Pricing Sales
Legal
Terms and conditions Privacy policy
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Show me some job opportunities
There's an error!