按滑块

Question

我有几个由javascript文件生成的地图。这意味着每个地图都是由一个javascript文件生成的。现在我想在我的html文件中包含一个滑块，让我可以在地图中滑动。我使用Basic jQuery Slider作为我的滑块的来源。
我的问题是链接的javascript文件总是被激活，这导致所有的地图同时显示。如何实现只有一个地图同时处于活动状态？ 到目前为止我的代码：

  <!--  Outer wrapper for presentation only, this can be anything you like -->
  <div id="banner-fade">

    <!-- start Basic Jquery Slider -->
    <ul class="bjqs">
      <li><script src="js/Map1.js"></script></li>
      <li><script src="js/Map2.js"></script></li>
      <li><script src="js/Map3.js"></script></li>
    </ul>
    <!-- end Basic jQuery Slider -->

  </div>
  <!-- End outer wrapper -->

  <script class="secret-source">
    jQuery(document).ready(function($) {

      $('#banner-fade').bjqs({
        height      : 2000,
        width       : 2000,
        responsive  : true
      });

    });
  </script>

  </div>

每张地图都是这样的：https://plnkr.co/edit/CwiFnNmfIleo5zZ6BseW?p=preview