Question

我正在构建时间轴/地图。这是一张顶部有滑块的地图;当您拖动滑块时，地图上会显示不同的图标，可以单击这些图标以启用模式弹出窗口（它还会在地图上显示叠加层）。它创造奇迹，看起来很漂亮，除了一件事：在加载时，显示一切。如何将其默认为地图上的第一个日期，作为显示的唯一图标和重叠？

代码如下，但我对代码并不多，也无法弄清楚我做错了什么：

有一个像这样的500个ID的列表

var popups = [ {id:"cultarg1969a", start:1969, end:1969},

然后是这样的：

 $(document).ready(function() {
  $("#slider").slider({
    min: 1491,
    max: 2020,
    step: 1,
    value: 1491,
  });


$( "#slider" ).bind( "slide", function(event, ui) {
    $(".category1,.category2,.category3,.category4,.category5,.iso").hide();
 $("#yearIndicator").text(ui.value);            
        for (var index=0;index<popups.length;index++) {
        var popup = popups[index];
        if (ui.value >= popup.start && ui.value <= popup.end) {
    $("#" + popup.id).show();
    }
} 
});

  $("#0").addClass("selected");

});

我只想在页面加载时显示1491年的项目。我究竟做错了什么？谢谢。

Answer 1

我的猜测是你可能希望最初隐藏弹出窗口数组中的每个元素，这最容易通过在其初始CSS中使用display: none来完成。 <{1}}调用应该在显示时覆盖.show()属性。

将Jquery滑块与模态弹出窗口相结合的问题

1 个答案: