Question

我的网页应用中有谷歌地图的这个信息框，我想在信息框点击链接上生成一个弹出框。我怎么能这样做？

Answer 1

infowindow可以包含HTML。只需编写infowindow内容中的链接，但通常使用HTML和/或javascript进行弹出。

<a href="page2.html" onclick="window.open('page2.html'); return false;" target="_blank">open popup</a>

Answer 2

通常弹出框用于HTML / JavaScript。请参阅弹出框的完整代码框和测试浏览器兼容。

<style>
.poppup_overlay{
    display: none;
    position:fixed;
    top: 0%;
    left: 0%;
    width: 100%;
    height: 100%;
    background-color: #000;
    z-index:10001;
    -moz-opacity: 0.7;
    opacity:.70;
    filter: alpha(opacity=70);
}

.poppup_content {
    display: none;
    position: absolute;
    padding:5px;
    border: 0px solid orange;
    background-color: white;
    z-index:10002;
    overflow: auto;
    width:300px;
    left:44%;
    margin-top: -250px;
    margin-left: -250px;
    top: 40%;
}

.poppup-image {
    display: none;
    position: absolute;
    padding:5px;
    border: 0px solid orange;
    background-color: white;
    z-index:10002;
    overflow: auto;
    width:300px;
    left:50%;
    margin-top: -250px;
    margin-left: -180px;
    top: 40%;
}

</style>


<body>

<!------popup google map---------> 
<a class="" href = "javascript:void(0)" onclick = "document.getElementById('light').style.display='block';document.getElementById('fade').style.display='block';document.getElementById('mapframe').src='embed URL here';">TEXT</a>
<div id="light" class="poppup_content"> <a href = "javascript:void(0)" onclick = "document.getElementById('light').style.display='none';document.getElementById('fade').style.display='none'"><img src="images/close.gif" border="0" align="right" /> </a><br />
  <br />
  <iframe id="mapframe" width="300" height="300" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" ></iframe>
  <br />
  <small><a href="embed URL here" style="color:#0000FF;text-align:left">TEXT</a></small></div>
<div id="fade" class="poppup_overlay">&nbsp;</div>


<!------popup image---------> 
<a class="" href = "javascript:void(0)" onclick = "document.getElementById('light1').style.display='block';document.getElementById('fade').style.display='block';document.getElementById('layout').src='images here';">Site Layout</a>
<div id="light1" class="poppup-image"> <a href = "javascript:void(0)" onclick = "document.getElementById('light1').style.display='none';document.getElementById('fade').style.display='none'"><img src="images/close.gif" border="0" align="right" /> </a><br />
  <br />
  <img src="images here" align="right" /> </div>
<div id="fade" class="poppup_overlay">&nbsp;</div>

</body>

如何在谷歌地图信息框中生成弹出窗口？

2 个答案: