谷歌地图信息框关闭按钮

问题描述：

我在Google地图上的信息框有问题。我像我想要的那样煽动了它，但关闭按钮却消失了：/ ...有人知道如何解决这个问题吗？谷歌地图信息框关闭按钮

我的代码：

<!DOCTYPE html> 
<html> 
<head> 
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"> </script> 
<script type="text/javascript" src="http://google-maps-utility-library-v3.googlecode.com/svn/trunk/infobox/src/infobox.js"></script> 
<script type="text/javascript"> 
function initialize() { 
var loc, map, marker, infobox; 

loc = new google.maps.LatLng(-33.890542, 151.274856); 

map = new google.maps.Map(document.getElementById("map"), { 
    zoom: 12, 
    center: loc, 
    mapTypeId: google.maps.MapTypeId.ROADMAP 
}); 

marker = new google.maps.Marker({ 
    map: map, 
    position: loc, 
    visible: true 
}); 

infobox = new InfoBox({ 
    content: document.getElementById("infobox"), 
    disableAutoPan: false, 
    maxWidth: 220, 
    pixelOffset: new google.maps.Size(-120, -320), 
    zIndex: null, 
    boxStyle: { 
     width: "220px" 
    }, 
    closeBoxMargin: "12px 12px 2px 2px", 
    closeBoxURL: "http://www.google.com/intl/en_us/mapfiles/close.gif", 
    infoBoxClearance: new google.maps.Size(1, 1) 
}); 

google.maps.event.addListener(marker, 'click', function() { 
    infobox.open(map, this); 
    map.panTo(loc); 
}); 
} 
google.maps.event.addDomListener(window, 'load', initialize); 
</script> 
<title>Creating and Using an InfoBox</title> 
</head> 

<body> 
<div id="map" style="width: 100%; height: 500px"></div> 
<br> 

<div class="infobox-wrapper"> 
<div id="infobox"> 
    <div class='actionInfo'> 
    <div class='markerImage'><a target='_blank' href=" + url + "><img src="http://www.plaveo.eu/Files/Actions/132_s.jpg"></a></div> 
    <div class='markerActionDescription'><h3><a target='_blank' href=" + url + ">Izdelava spletne strani - PAKET BRONZE - 11%</a></h3></div> 
    <div class='actionTill'>Traja do: <b>10.10.2014 16h </b> <br /> <a target='_blank' href=" + url + ">Več tukaj ...</a></div> 
    </div> 
    <hr /> 
    <div class='coName'><strong>FUTURO WEB DESIGN</strong></div> 
    <div class='coAddress'>Grajska cesta 26, 4260 Bled</div> 
    <div class='coContact'>Tel.: 040 351 766</div> 
</div> 
</div> 
</body> 
</html>

CSS

.infobox-wrapper { 
display:none; 
width: 220px; 
} 

#infobox { 
position: relative; 
background: #7dc9c8; 
border: 5px solid #ffffff;  
max-width: 200px; 
font-family:Roboto; 
padding: 10px; 
} 

#infobox:after, #infobox:before { 
top: 100%; 
left: 50%; 
border: solid transparent; 
content: " "; 
height: 0; 
width: 0; 
position: 
absolute; 
pointer-events: none; 
} 

#infobox:after { 
border-color: rgba(125, 201, 200, 0); 
border-top-color: #7dc9c8; 
border-width: 20px; 
margin-left: -20px; 
} 

#infobox:before { 
border-color: rgba(255, 255, 255, 0); 
border-top-color: #ffffff; 
border-width: 27px; 
margin-left: -27px; 
}

http://jsfiddle.net/jEhJ3/3521/

答

的按钮被#infobox覆盖。

设置了负z-index为#infobox（如-1）

现在我有新的问题，...在信息框链接不工作...：/ – 2014-10-10 09:34:35

你能指望有像'A HREF +网址+'？ – 2014-10-10 22:44:15

谷歌地图信息框关闭按钮

相关推荐