JSFiddle - React, Tailwind, and code Playground

HTML

<!DOCTYPE html>
<html>
  
  <head>
    <title>Leaflet - several popups open at the same time</title>
    <meta charset="utf-8"
    />
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <!-- <link rel="stylesheet" href="dist/leaflet.css" />-->
    <link rel="stylesheet" href="http://cdn.leafletjs.com/leaflet-0.4.5/leaflet.css"
    />
    <!--[if lte IE 8]>
      <link rel="stylesheet" href="http://cdn.leafletjs.com/leaflet-0.4.5/leaflet.ie.css"
      />
    <![endif]-->
    <script src="http://cdn.leafletjs.com/leaflet-0.4.5/leaflet.js"></script>
  </head>
  
  <body>
    <div id="map" style="width: 600px; height: 400px"></div>
  </body>

</html>

JavaScript

var map = L.map('map').setView([51.505, -0.09], 13);

		L.tileLayer('http://{s}.tile.cloudmade.com/BC9A493B41014CAABB98F0471D759707/997/256/{z}/{x}/{y}.png', {
		  maxZoom: 18,
		  attribution: 'Map data &copy; <a href="http://openstreetmap.org">OpenStreetMap</a> contributors, <a href="http://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>, Imagery © <a href="http://cloudmade.com">CloudMade</a>'
		}).addTo(map);

		var myIcon = new L.Icon.Default();
		var myMarker = L.marker([51.5, -0.09], {
		  icon: myIcon
		}).addTo(map);

		map.on('zoomend', changeIconSize);

		function changeIconSize(e) {

		  // this is the default size (of the default icon); it should be known beforehand;
		  var defaultIconSize = new L.Point(25, 41);
		  var defaultShadowSize = new L.Point(41, 41);

		  // use leaflet's internal methods to scale the size (a bit overkill for this case...)
		  var transformation = new L.Transformation(1, 0, 1, 0);

		  var currentZoom = map.getZoom();
		  var newIconSize = transformation.transform(defaultIconSize, sizeFactor(currentZoom));
		  var newShadowSize = transformation.transform(defaultShadowSize, sizeFactor(currentZoom));

		  // adjust the icon anchor to the new size
		  var newIconAnchor = new L.Point(Math.round(newIconSize.x / 2), newIconSize.y);

		  // finally, declare a new icon and update the marker
		  var newIcon = new L.Icon.Default({
		    iconSize: newIconSize,
		    iconAnchor: newIconAnchor,
		    shadowSize: newShadowSize,
		  });

		  myMarker.setIcon(newIcon);
		}

		function sizeFactor(zoom) {
		  if (zoom <= 8) return 0.3;
		  else if (zoom == 9) return 0.4;
		  else if (zoom == 10) return 0.5;
		  else if (zoom == 11) return 0.7;
		  else if (zoom == 12) return 0.85;
		  else if (zoom == 13) return 1.0;
		  else if (zoom == 14) return 1.3;
		  else if (zoom == 15) return 1.6;
		  else if (zoom == 16) return 1.9;
		  else // zoom >= 17
		  return 2.2;
		}