在Google地图中损坏了jQuery Accordion [英] Broken jQuery Accordion in Google Maps

问题描述

我试图在Google Map中显示一个里面的里面的手风琴，但是当它从我的手风琴菜单上点击时，它不会作为手风琴，当我重新打开它时。我无法从头开始创建自己的手风琴，因此无法解决这个问题。如何使它正常工作的任何帮助？

http://mulibraries.missouri.edu/Reference/virtour/demo_fs_mobile.php

解决方案

您需要再次使用事件创建这些元素。

我使用 jQuery 改进了代码，试试这个：

 函数HomeControl（controlDiv，map）{
 var menu_btn = $（< div>）; 
 menu_btn.attr（'id'，'menu_btn'）; 
 menu_btn.attr（'title'，'点击显示地图导航'）; 
 menu_btn.html（'< b> Menu< / b>'）; 
 menu_btn.css（{
 backgroundColor：'white'，
 cursor：'pointer'，
 textAlign：'center'，
}）; 
 $ b $（menu_btn）.click（function（）{
 $（controlDiv）.empty（）; 
 
 menu_state = 1; 
 
 var menu_nav = $（< div>）; 
 menu_nav.attr（'id'，'menu_nav'）; 
 menu_nav.attr（'title'，'点击地图关闭菜单'）; 
 menu_nav.css（{
 backgroundColor：'white'，
 cursor：'pointer'，
 textAlign：'center'，
}）; 
 
 var accordion = $（'< / div>< / h3>< div> Ellis< br> Engineering< br>新闻< / div>< h3>< a href =＃>更改楼层< / a>< / h3>< div>首层< br>楼层< br>二楼< br>三楼< br>四楼< br>< / div>< h3>< a href =＃>更改地图< / a>< / h3><< ; div>虚拟游览< br>视频游览< br>书房< br> Comp uters< / DIV>< / DIV>）; 
 
 $（menu_nav）.append（手风琴）; 
 $（controlDiv）.append（menu_nav）; 
 
 $（手风琴）.accordion（{active：1，autoHeight：false}）; 
}）; 
 
 $（controlDiv）.empty（）; 
 $（controlDiv）.append（$（menu_btn）.clone（true））; 
 
 google.maps.event.addDomListener（map，'click'，function（）{
 menu_state = 0; 
 
 $（controlDiv）.empty（） ; 
 $（controlDiv）.append（$（menu_btn）.clone（true））; 
}）; 
} 
  

希望这有助于您。

I am trying to display a jQuery accordion inside of a Google Map, I have it working however when I click away from my accordion menu it will not act as an accordion when I re-open it. I'm at a loss as to how to fix it without creating my own accordion from scratch. Any help as to how to make it work properly?

http://mulibraries.missouri.edu/Reference/virtour/demo_fs_mobile.php

解决方案

You need create these elements again with events too.

I improved your code using jQuery, try this:

function HomeControl(controlDiv, map) {
    var menu_btn = $("<div>");
    menu_btn.attr('id', 'menu_btn');
    menu_btn.attr('title', 'Click to show the Map Navigation');
    menu_btn.html('<b>Menu</b>');
    menu_btn.css({
        backgroundColor: 'white',
        cursor: 'pointer',
        textAlign: 'center',
    });

    $(menu_btn).click(function() {
        $(controlDiv).empty();

        menu_state = 1;

        var menu_nav = $("<div>");
        menu_nav.attr('id', 'menu_nav');
        menu_nav.attr('title', 'Click Map to close Menu');
        menu_nav.css({
            backgroundColor: 'white',
            cursor: 'pointer',
            textAlign: 'center',
        });

        var accordion = $('<div id="accordion"><h3><a href="#">Change Library</a></h3> <div>Ellis<br>Engineering<br>Journalism</div><h3><a href="#">Change Floor</a></h3> <div>Ground Floor<br>First Floor<br>Second Floor<br>Third Floor<br>Fourth Floor<br></div> <h3><a href="#">Change Map</a></h3> <div>Virtual Tour<br>Video Tour<br>Study Rooms<br>Computers</div></div>');

        $(menu_nav).append(accordion);
        $(controlDiv).append(menu_nav);

        $(accordion).accordion({active: 1, autoHeight: false});
    });

    $(controlDiv).empty();
    $(controlDiv).append($(menu_btn).clone(true));

    google.maps.event.addDomListener(map, 'click', function() {
        menu_state = 0;

        $(controlDiv).empty();
        $(controlDiv).append($(menu_btn).clone(true));
    });
}

Hope this helps.

这篇关于在Google地图中损坏了jQuery Accordion的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！