|
Как сделать точное наведение на изображение?
Пытаюсь сделать игру для детей, типа "Зоопарк" или что-то такое.
Пишу на javascript с библиотекой Pixi.js.
Добавляю объекты - спрайты (картинки формата png), банан в данном случае, вот так:
const banan = PIXI.Sprite.from('images/banan.png')
Картинка сделана в фотошопе, это банан а вокруг него прозрачные пиксели.
Добавляю для него события
banan.on('pointerdown', onButtonDown);
banan.on('pointerup', onButtonUp);
banan.on('pointerupoutside', onButtonUp);
banan.on('pointerover', onButtonOver);
banan.on('pointerout', onButtonOut);
app.stage.addChild(banan);
дальше функции, которые позволят вызывать делать что-либо при наведении на картинку, их я не привожу сдесь.
Проблема в том, что событие pointerover срабатывает уже когда курсор наводится на прозрачные пиксели в изображении банана, а нужно чтобы срабатывало точно при наведении на картинку банана.
Подскажите как это реализовать?
|
