0

タイムライン/マップを作成しています。上部にスライダーがあるマップです。スライダーをドラッグすると、さまざまなアイコンがマップ上に表示され、クリックするとモーダル ポップアップが表示されます (マップ上にオーバーレイも表示されます)。それは驚くほど機能し、美しく見えますが、1 つのことを除いて、読み込み時にすべてが表示されます。表示される唯一のアイコンとオーバーラップとして、マップ上の最初の日付にデフォルト設定するにはどうすればよいですか?

コードは以下のとおりですが、私はコードにあまり興味がなく、何が間違っているのかわかりません。

このような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 年のアイテムが表示されるようにしたいだけです。私は何を間違っていますか？ありがとうございました。

4

1 に答える 1

0

私の推測では、ポップアップ配列の各要素を最初に非表示にする必要があると思います。これはdisplay: none、最初のCSSに含めることで最も簡単に実行できます。呼び出しは、それを表示するときに.show()そのプロパティをオーバーライドする必要があります。display

于 2012-12-19T03:50:43.463 に答える