Как получить событие «onclick» через прозрачное изображение?

У меня есть html-страница. В середине страницы я показываю gif-изображение, которое является частично прозрачным.Как получить событие «onclick» через прозрачное изображение?

Если я нажимаю на непрозрачные части изображения на ссылках, которые находятся под изображением, я не получаю событие «onclick» из-за изображения.

Можно ли игнорировать изображение и получать события по ссылкам?

ОБНОВЛЕНИЕ: My layout: Невозможно нажать на «Alternativ».

enter image description here

источник

2012-03-14 podeig

Можете ли вы показать пример? – Neal

Возможный дубликат [Щелкните через DIV в базовые элементы] (http://stackoverflow.com/questions/3680429/click-through-a-div-to-underlying-elements) ** или ** [Игнорировать взаимодействие с мышью на прозрачные части на изображении и назначьте его изображению ниже] (http://stackoverflow.com/q/2607162/94197) –

Ну если ссылки в соответствии с изображения, то они unclickable.

Что вы, возможно, нужно сделать, это снижение CSS-z-index изображения и увеличениеz-index ссылок, чтобы сделать их интерактивными.

источник

2012-03-14 13:11:00 Neal

Чем текст будет над изображением. Это не поможет. – podeig

Если изображение статичное и не перемещающееся, вы можете легко использовать изображение maps или разместить свои ссылки поверх прозрачного изображения.

источник

2012-03-14 13:11:21 epoch

На самом деле я не знаю вашего макета, но я думаю, что есть несколько возможностей. Вы можете использовать imagemap, чтобы имитировать щелчок по ссылкам под gif. Итак, когда ссылка размещена, вы определяете кликабельную область на карте изображения. Возможно, это будет использовать gif в качестве фонового изображения. Не следует ничего менять в макете, и ссылки будут сверху.

НТН,

--hennson

источник

2012-03-14 13:14:33 hennson

сделать событие, огонь его:

var realTarget = document.querySelector('...'); 
var img = document.querySelector('...'); 

img.addEventListener("click", function(evt) { 
    var newEvt = document.createEvent("MouseEvents"); 
    newEvt.initMouseEvent("click", true, true, window, 
    evt.detail, evt.screenX, evt.screenY, evt.clientX, evt.clientY, 
    evt.ctrlKey, evt.altKey, evt.shiftKey, evt.metaKey, 
    evt.button, evt.relatedTarget); 
    realTarget.dispatchEvent(newEvt); 
}, false);

источник

2013-03-26 22:06:35

Как получить событие «onclick» через прозрачное изображение?

ответ

Смежные вопросы