У меня есть немного прогноза, когда я работаю над игрой, в которой люди движутся поверх множества плиток, которые определяют их движение при нажатии.Проблема в том, что мне нужно разрешить пользователям нажимать за аватарами пользователей, чтобы перемещаться по плиткам позади их спрайтов при нажатии вокруг пользователя.Ниже приведен пример игрового мира ...
Элемент img (выделен синей рамкой), который накладывается накликабельный tiles в свою очередь блокирует возможность кликать по аватарам в комнате и запрещает большое количество перемещений игрока.
Обнаружив эту проблему, я обнаружил тег CSS:
.avatar {
pointer-events: none;
}
Это помогло мне решить проблему с просмотром аватаров, и теперь я могу нажимать на плитки, которые блокируют игроки, хотя мне нужно, чтобы элементы .avatar были кликабельными для функциональности игры.По сути, мне нужна возможность наблюдать за click событиями, а также иметь возможность click и hover за фактическим аватаром.
Я изучил генераторы карт дляHTML5 и JavaScript, хотя они все еще дают право на то, что элемент существует там, но только позволяют определенному региону стать активным.
В настоящее время (с включенным pointer-events: none;) у меня есть код jQuery следующим образом:
$(document).on('click', '.avatar', function(event){
console.log('an avatar was clicked...');
});
Проще говоря, я спрашиваю, является ли это решением для выбора двух объектов, вместо того, чтобы выбирать между этими двумя компромиссами.Или убрать прозрачную область изображения, чтобы можно было щелкнуть за ней другие области (удалив ненужную часть PNG).