diff --git a/betty/plugin/maps/assets/js/maps.js b/betty/plugin/maps/assets/js/maps.js
index a4073e849..0170ae1eb 100644
--- a/betty/plugin/maps/assets/js/maps.js
+++ b/betty/plugin/maps/assets/js/maps.js
@@ -7,8 +7,12 @@ import leafletStyle from 'leaflet/dist/leaflet.css' // eslint-disable-line no-un
 import leafletMarkerIconImage from 'leaflet/dist/images/marker-icon.png'
 import leafletMarkerIcon2xImage from 'leaflet/dist/images/marker-icon-2x.png'
 import leafletMarkerShadowImage from 'leaflet/dist/images/marker-shadow.png'
+import { GestureHandling } from 'leaflet-gesture-handling'
+import 'leaflet-gesture-handling/dist/leaflet-gesture-handling.css' // eslint-disable-line no-unused-vars
 import configuration from './configuration.json'
 
+L.Map.addInitHook('addHandler', 'gestureHandling', GestureHandling)
+
 let mapCount = 0
 
 function initializePlaceLists () {
@@ -22,7 +26,9 @@ function initializePlaceList (placeList) {
   const mapArea = placeList.getElementsByClassName('map')[0]
   mapArea.id = (++mapCount).toString()
 
-  const map = L.map(mapArea.id)
+  const map = L.map(mapArea.id, {
+    gestureHandling: true
+  })
 
   // Build the attribution layer.
   L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
diff --git a/betty/plugin/maps/assets/js/package.json b/betty/plugin/maps/assets/js/package.json
index 983432eb3..912dd0ca0 100644
--- a/betty/plugin/maps/assets/js/package.json
+++ b/betty/plugin/maps/assets/js/package.json
@@ -11,7 +11,8 @@
     "core-js": "^3.6.5",
     "css-loader": "^3.6.0",
     "file-loader": "^6.0.0",
-    "leaflet": "^1.6.0",
+    "leaflet": "~1.6.0",
+    "leaflet-gesture-handling": "^1.1.8",
     "mini-css-extract-plugin": "^0.9.0",
     "webpack": "^4.43.0",
     "webpack-cli": "^3.3.11"