向传单地图添加自定义html

Question

我有一个html模板。我想在地图上将模板添加到左侧位置。首先，我添加了地图容器。这里的问题是，更改缩放比例后，自定义模板消失了。如何使用其他方式？

HTML

    <div id="map" class="active"></div>
    <ul>
        <li><button onclick="fullSc();"><span>Full sc</span></button></li>
        <li><button onclick="findMe();"><span>Find</span></button></li>        
    </ul>

JS

  var map = L.map('map', {
       zoomControl: true,
       maxZoom: 18,
       minZoom: 0
  }).setView([41.00650212603, 28.8530806151128], 13);

 L.tileLayer('https://{s}.google.com/vt/lyrs=s,h&x={x}&y={y}&z={z}', {
    subdomains: ['mt0', 'mt1', 'mt2', 'mt3']
 }).addTo(map);
var marker = L.marker(map.getCenter(), {
    draggable: true,
    icon: L.icon({
        iconUrl: '/assets/img/pin-4ldpi.png',
        iconSize: [30, 35],
        iconAnchor: [30 / 2, 35],
    })
}).addTo(map);