我正在使用信息框。我能够加载所有标记,在每个信息框中加载不同的内容,然后“正确”触发。然后从哪里开始问题:
1) 在桌面/iOS 上,我的 Toggle 事件仅在第二次单击后起作用。基本上它上下移动一个div。请参阅下面的代码:
//Setting up the marker
var marker = new google.maps.Marker({
map: map,
draggable: false,
position: latlng6,
visible: true
});
var boxText = document.createElement("div");
boxText.class = "test";
boxText.style.cssText = "height: 0px;";
boxText.innerHTML = "<div id='top'><p>SUSSAN</p><a href='#' class='info'>+ info</a>"
+ "<h2></h2>"
+ "</div>"
+ "<div id='promo'>"
+ "<div class='badge'>"
+ "<img src='hot@2x.png'>"
+ "</div>"
+ "<p>TODAY UP TO 70% OFF</p>"
+ "</div>";
var myOption = {
content: boxText
,disableAutoPan: false
,maxWidth: 0
,pixelOffset: new google.maps.Size(-128, -161)
,zIndex: null
,boxStyle: {
background: "url('') no-repeat"
,opacity: 1
,width: "280px"
,height: "0px"
}
,closeBoxMargin: "36px 25px 0px 0px"
,closeBoxURL: "http://www.google.com/intl/en_us/mapfiles/close.gif"
,infoBoxClearance: new google.maps.Size(1, 1)
,isHidden: false
,zIndex: 999999
,pane: "floatPane"
,enableEventPropagation: false
};
var ib = new InfoBox(myOption);
boxList.push(ib);
//ANIMATE MORE INFO
google.maps.event.addDomListener(boxList[i].content_,'click', function() {
$("#promo").toggle( function(a) {
$("#top").animate({top: 14}, 200)},
function() {
$("#top").animate({top: 50}, 200);;
});
2) 在 iOS 上,即使是第一个问题,当我第一次“点击”div“促销”时,信息框在桌面上消失,也不会发生。如果我返回,请再次打开信息框并点击 div“促销”,它可以用作桌面。我相信第二个问题与第一个问题有关。但不确定为什么它只发生在 iOS 上。 =/感谢任何帮助。
最佳答案
我不能告诉你关于 iOS 问题的任何信息,但关于第一个问题:
切换处理程序在第一次点击之后附加,这就是第一次点击无法触发切换事件的原因。
您可以直接附加切换而不是等待第一次点击(用以下代码替换您当前的 boxList[i].content_ 的点击处理程序)
$("#promo",boxList[i].content_)
.toggle(
function(a) {
$("#top").animate({top: 14}, 200);
},
function() {
$("#top").animate({top: 50}, 200);
});
关于jquery - Google Maps InfoBox 未按预期在 iOS 上触发事件,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/14423581/