У нас есть тест, который мы разработали во Flash несколько лет назад и который использовал области попадания, чтобы определить, щелкнул ли кто-нибудь по соответствующей части изображения (например, «Анатомическая викторина»). Эти области попадания были очень утомительны для контура, и нет возможности повторно использовать данные координат контура ...
Теперь мы пытаемся сделать это заново в HTML. Итак, у нас есть фоновое изображение бедренной кости и png, который расположен выше в Z-порядке, и его часть полностью прозрачна, а другие части имеют 50% серого. Это используется, чтобы научить студента ГДЕ что-то находится на фоновом изображении бедра.
Мне бы хотелось иметь возможность использовать данные из этого слоя маски png в «режиме викторины», чтобы определить, правильно ли студент щелкнул мышкой по определенной части бедренной кости ... Я думал установить png для маскировки до 100% прозрачности (таким образом, ученик не видит его), но если браузер знал, что они щелкали в правильной области изображения (то есть на 100% прозрачно на маске), то они нажимали правильно.
Есть идеи, как этого добиться с помощью HTML, CSS и / или jQuery?