Question

您好，

这是我的网站www.livehazards.com。我试图将与每次地震相关的弹出框移动到屏幕的右下角。

以下是与弹出框

相关联的代码

 .mapboxgl-popup-content {padding:10px; background:rgba(54, 69, 79, 0.8); color:#fff; pointer-events:none;}

 var feature = features[0];
var popup = new mapboxgl.Popup()
    .setLngLat (feature.geometry.coordinates)
    .setHTML ('Magnitude = <b> '+ feature.properties.mag + '</b>,' + ' Location = <b>' + feature.properties.place + '</b>,' + ' Time: <b> ' + expressTime(feature.properties.time)[0]+' '+expressTime(feature.properties.time)[1]+' ago </b>'+ '  Felt by:<b> ' + Feltby(feature.properties.felt)+ '</b>').addTo(map);

}）;

...我可以相对于该点移动弹出框，但不能将弹出框移动到特定区域并将其锚定在那里（即使位置：绝对？）

.mapboxgl-popup-content {
right:100px;
bottom:100px;
position:absolute;
  }

有谁知道如何做到这一点谢谢？

Answer 1

使用position:fixed相对于视口设置它（虽然在您的情况下容器是完整大小，您可以使用position:absolute ），并添加{{1禁用库应用的内联样式。

transform:none!important

如何将弹出窗口移动到屏幕特定部分的锚点/位置？

1 个答案: