如何在Google Maps API中退出全屏模式

Posted 2021-03-28

我正在使用谷歌地图编程网页和一些标记（点）。标记有一些InfoWindows，在InfoWindow中是指向同一页面上<div>标记的链接。就像是

var infowindow = new google.maps.InfoWindow({
            content: '<a href="#info">See info</a>'
        });

通过这种方式，用户可以在地图上显示InfoWindow，然后用户可以在网页上显示以下附加信息。

它工作正常。但是，如果地图处于全屏模式，则链接不起作用。

如果用户在全屏模式下点击链接，我想

1. 退出全屏模式，然后
2. 滚动到锚定的<div id =“info”>

有人可以帮忙吗？

我已经测试过，如果链接转到另一个网页，那么即使在FullScreen模式下也能正常工作。问题仅在于链接同一页面（通过#id）。

答案

我调整了原来的解决方案：

我muset设置onClick监听器链接ant这个监听器必须处理两个步骤：1）退出全屏模式和2）滚动到给定的标签

退出全屏模式是通过以下方式完成的：i）检查文档是否处于全屏模式，如果是，则ii）退出全屏模式。

这必须针对不同的webkits完成

function onClickListener(id) {

    // Exit Full Screen Mode
    if (document.fullscreenElement ) {
    document.exitFullscreen();
    } else if (document.mozFullScreenElement ) {
    document.mozCancelFullScreen();
    } else if (document.webkitFullscreenElement ) {
    document.webkitExitFullscreen();
    } else if (document.msFullscreenElement  ) {
    document.msExitFullscreen();
    }

    // Scroll to #id - using jQuery
    $('html,body').animate({scrollTop:$('#'+id).offset().top}, 700);

    return false;
}