Anonymous
Сделать наложение div на листовку не кликабельным
Сообщение
Anonymous » 02 фев 2026, 12:19
Как сделать, чтобы накладывающийся элемент div на карте-листовке не переходил по клику? Я установил
Я пробовал события указателя: none и auto в наложенном div, но это не помогло. Установка для pointer-events значения none привела к тому, что радиокнопка больше не доступна для нажатия...
Код: Выделить всё
// We’ll add a tile layer to add to our map, in this case it’s a OSM tile layer.
// Creating a tile layer usually involves setting the URL template for the tile images
var osmUrl = 'http://{s}.tile.osm.org/{z}/{x}/{y}.png',
osmAttrib = '© [url=http://openstreetmap.org/copyright]OpenStreetMap[/url] contributors',
osm = L.tileLayer(osmUrl, {
maxZoom: 18,
attribution: osmAttrib
});
// initialize the map on the "map" div with a given center and zoom
var map = L.map('map').setView([19.04469, 72.9258], 12).addLayer(osm);
// Script for adding marker on map click
function onMapClick(e) {
var marker = L.marker(e.latlng, {
draggable: true,
title: "Resource location",
alt: "Resource Location",
riseOnHover: true
}).addTo(map)
.bindPopup(e.latlng.toString()).openPopup();
// Update marker on changing it's position
marker.on("dragend", function(ev) {
var chagedPos = ev.target.getLatLng();
this.bindPopup(chagedPos.toString()).openPopup();
});
}
map.on('click', onMapClick);
Код: Выделить всё
#map {
height: 500px;
width: 80%;
z-index: 1;
position: relative;
}
.overlay {
height: 500px;
width: 100px;
position: absolute;
right: 0px;
z-index: 2;
background-color: rgba(255, 50, 50, 0.5);
pointer-events: auto;
}
Подробнее здесь:
https://stackoverflow.com/questions/397 ... ck-through
1770023973
Anonymous
Как сделать, чтобы накладывающийся элемент div на карте-листовке не переходил по клику? Я установил Я пробовал события указателя: none и auto в наложенном div, но это не помогло. Установка для pointer-events значения none привела к тому, что радиокнопка больше не доступна для нажатия... [code]// We’ll add a tile layer to add to our map, in this case it’s a OSM tile layer. // Creating a tile layer usually involves setting the URL template for the tile images var osmUrl = 'http://{s}.tile.osm.org/{z}/{x}/{y}.png', osmAttrib = '© [url=http://openstreetmap.org/copyright]OpenStreetMap[/url] contributors', osm = L.tileLayer(osmUrl, { maxZoom: 18, attribution: osmAttrib }); // initialize the map on the "map" div with a given center and zoom var map = L.map('map').setView([19.04469, 72.9258], 12).addLayer(osm); // Script for adding marker on map click function onMapClick(e) { var marker = L.marker(e.latlng, { draggable: true, title: "Resource location", alt: "Resource Location", riseOnHover: true }).addTo(map) .bindPopup(e.latlng.toString()).openPopup(); // Update marker on changing it's position marker.on("dragend", function(ev) { var chagedPos = ev.target.getLatLng(); this.bindPopup(chagedPos.toString()).openPopup(); }); } map.on('click', onMapClick);[/code] [code]#map { height: 500px; width: 80%; z-index: 1; position: relative; } .overlay { height: 500px; width: 100px; position: absolute; right: 0px; z-index: 2; background-color: rgba(255, 50, 50, 0.5); pointer-events: auto; }[/code] [code] Foo Bar [/code] Подробнее здесь: [url]https://stackoverflow.com/questions/39764833/make-overlaying-div-on-leaflet-not-click-through[/url]