Как сделать карты областей изображения с абсолютным позиционированием кликабельными с помощью мыши?

У меня есть несколько изображений, расположенных друг над другом с использованием абсолютного позиционирования. Эти изображения частично прозрачны и имеют html областьи карту, чтобы сделать кликабельными только видимые части. В jQuery я привязал события мыши к тегам area.

Это хорошо работает для одного изображения: mouseenter и mouseleave срабатывают только при входе в отображенную часть изображения.

Проблема в том, что это работает только для верхнего изображения. Для всех остальных он не запускает события и не работает наведение CSS, потому что поверх него есть другое изображение. И это несмотря на то, что areas не перекрываются, а maps находятся перед изображениями.

Вот демонстрация проблемы: http://markv.nl/stack/imgmap2/