0

我在 wordpress 和 jQuery 选项卡中使用了 easy2map 插件,如下所示

在模板文件中:

  <ul id="tabs">
  <li><a href="#" name="#tab1">Own Unit</a></li>
  <li><a href="#" name="#tab2">Franchise Unit</a></li>
 </ul>
  <div id="tabbed-content">
       <div id="tab1">
       //short code of map 1
       </div>
       <div id="tab2">
       //short code of map 2
       </div>
    </div>

在 jQuery 中:

 <script type="text/javascript">
 var map=jQuery.noConflict(true);  
function resetTabs(){
    map("#tabbed-content > div").hide(); //Hide all content
    map("#tabs a").attr("id",""); //Reset id's      
}

var myUrl = window.location.href; //get URL
var myUrlTab = myUrl.substring(myUrl.indexOf("#")); // For localhost/tabs.html#tab2, myUrlTab = #tab2     
var myUrlTabName = myUrlTab.substring(0,4); // For the above example, myUrlTabName = #tab

(function(){
    map("#tabbed-content > div").hide(); // Initially hide all content
    map("#tabs li:first a").attr("id","current"); // Activate first tab
    map("#tabbed-content > div:first").fadeIn(); // Show first tab content

    map("#tabs a").on("click",function(e) {
        e.preventDefault();
        if (map(this).attr("id") == "current"){ //detection for current tab
         return       
        }
        else{             
        resetTabs();
        map(this).attr("id","current"); // Activate this
        map(map(this).attr('name')).fadeIn(); // Show content for current tab
        }
    });

    for (i = 1; i <= map("#tabs li").length; i++) {
      if (myUrlTab == myUrlTabName + i) {
          resetTabs();
          map("a[name='"+myUrlTab+"']").attr("id","current"); // Activate url tab
          map(myUrlTab).fadeIn(); // Show url tab content        
      }
    }
})()

我的问题是地图在 tab1 中完全加载,但在 tab2 中没有....请帮助我!!!

4

1 回答 1

1

使用绝对位置隐藏选项卡。

position: absolute;
left: -9999px;
top: -9999px;

而不是显示:无;

因为在显示的情况下:无;js-code 将无法运行(或使用 firebug 检查 - 可能只是在地图初始化时为地图视口计算错误的宽度/高度)

于 2013-05-13T16:04:46.153 回答