<script>
  var map = L.map('map');
  map.setView(new L.LatLng(45, 9.5), 5);
  var control = L.control.layers(null, null, {
    collapsed: false
  }).addTo(map);
  var Basemap = L.tileLayer('https://{s}.tile.opentopomap.org/{z}/{x}/{y}.png', {
    maxZoom: 17,
    attribution: 'Map data: &copy; <a href="http://www.openstreetmap.org/copyright">OpenStreetMap</a>, <a href="http://viewfinderpanoramas.org">SRTM</a> | Map style: &copy; <a href="https://opentopomap.org">OpenTopoMap</a> (<a href="https://creativecommons.org/licenses/by-sa/3.0/">CC-BY-SA</a>)',
    opacity: 0.90
    });
  Basemap.addTo(map);
  var Overlay = L.tileLayer('https://tile.waymarkedtrails.org/{id}/{z}/{x}/{y}.png', {
    id: 'hiking',
    pointable: true,
    attribution: '&copy; <a href="http://waymarkedtrails.org">Sarah Hoffmann</a> (<a href="https://creativecommons.org/licenses/by-sa/3.0/">CC-BY-SA</a>)',
  });
  Overlay.addTo(map);
  control.addOverlay(Overlay, "ON / OFF");
  map.on("pointable_mouseclick",function(e){
    map.openPopup("<b>Clicked overlay</b>: " + e.latlng.lat + "," + e.latlng.lng, e.latlng);
  });
</script>