[Bug]: Using a lizmap map as iframe inside bootstrap site: auto scroll to the iframe
What is the bug?
When I use a lizmap map on an iframe inside a bootsrap HTML page the page automatically scroll on the lizmap map.
Steps to reproduce the issue
Here a simple example of a webpage which use a lizmap map (for the test I use a demo map, but you can try with each lizmap map):
<html>
<head>
<!-- CSS only -->
<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-Zenh87qX5JnK2Jl0vWa8Ck2rdkQ2Bzep5IDxbcnCeuOxjzrPF/et3URy9Bv1WTRi" crossorigin="anonymous">
</head>
<body>
<div id="wrapper">
<h2> TEST no js incluso - da iniettare </h2>
<br>
<br>
<h1> aaa </h1>
<br>
<br>
<h1> aaa </h1>
<br>
<br>
<h1> aaa </h1>
<br>
<br>
<h1> aaa </h1>
<br>
<br>
<h1> aaa </h1>
<br>
<br>
<h1> aaa </h1>
<br>
<br>
<h1> aaa </h1>
<br>
<br>
<h1> aaa </h1>
<br>
<br>
<h1> aaa </h1>
<iframe id="openstreet-map1" name="openstreet-map1-name" src="https://demo.lizmap.com/lizmap/index.php/view/map/?repository=demo&project=Demo_plu"border="0" style="margin: 0px; padding: 0px; height: 694.156px; width: 100%; min-height: 320px; border: none; overflow: hidden;"></iframe>
</div>
</body>
<!-- JavaScript Bundle with Popper -->
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js" integrity="sha384-OERcA2EqjJCMA+/3y+gxIOqMEjwtxJY7qPCqsdltbNJuaOe923+mo//f6V8Qbsw3" crossorigin="anonymous">
</script>
</html>
Versions
Lizmap 3.5.X QGIS Server 3.22.X
Check Lizmap plugin
- [x] I have done the step just before in the Lizmap QGIS desktop plugin before opening this ticket. Otherwise, my ticket is not considered valid and might get closed.
QGIS server version, only if the section above doesn't mention the QGIS Server version
No response
Operating system
Ubuntu 20.04
Browsers
Firefox, Chrome, Microsoft Edge
Browsers version
All recent versions
Relevant log output
No response
Can I do something else? It seems not related to this issue https://github.com/3liz/lizmap-web-client/issues/645
blind guess : some js events force the focus on the iframe, so the browser scroll to it
a solution can be made using custom js script, once the ui is loaded to force window.parent to scroll in top
lizMap.events.on({
uicreated: function(e) {
window.parent.scrollTo(0,0);
}
});
blind guess : some js events force the focus on the iframe, so the browser scroll to it
a solution can be made using custom js script, once the ui is loaded to force window.parent to scroll in top
lizMap.events.on({ uicreated: function(e) { window.parent.scrollTo(0,0); } });
It works but only for simple page.. I try also with widow.self.scrollTo(0,0); but it doesn't work
sorry @Gustry do you expect more feedbacks from me? The solution proposed by @nworr doesn't work very well
@rmarzocchi84 I'm facing the same problem. Did you find a solution ?
unfortunately no
A public example can be found here: https://noe.gard.fr/observatoire/information-preventive-et-sensibilisation/reperes-de-crue.html
Same issue
A public example can be found here: https://noe.gard.fr/observatoire/information-preventive-et-sensibilisation/reperes-de-crue.html
Same issue
same problem at https://www.centipede-rtk.org/ and https://docs.centipede.fr/.
Is there any way of improving this problem, as it has been recurring for a long time?
@laurentj , do you have any idea where this autofocus is coded please?