Add jquery lightbox to a mapped image

Question

I have an image I’m mapping and I want to put a link in some points, only when clicking these points I want you to open a window using some jquery plugin (lightbox type), to give a better effect, see the code I’m using:

<img class="zoomImg" src="images/crateria.png" style="position: absolute; top: -436.066px; left: -511.866px; opacity: 0; width: 2000px; height: 1494px; border: medium none; max-width: none; max-height: none;" usemap="#crateria-map">
<map name="crateria-map">
<area class="html5lightbox" href="https://www.youtube.com/watch?v=FXL2v657IZ4" shape="rect" coords="716,382,755,406" alt="map crateria">
</map>

Since the lightbox I’m using works only if an IMG tag is inside an A tag.

Help!

Answer 1

I found the answer on the site where I lowered the plugin: https://html5box.com

In the part where you have "recently Asked questions", have a question about how to activate the effect using javascript, below the codes to open image, youtube video and video Vimeo:

FOR IMAGE:

Function ativarlightbox(){ html5Lightbox.showLightbox(0, 'images/Toronto_1024.jpg', 'Image lightbox'); }

YOUTUBE VIDEO:

Function ativarlightbox(){ html5Lightbox.showLightbox(3, 'http://www.youtube.com/embed/YE7VzlLtp-4', 'Youtube lightbox');

VIDEO OF VIMEO:

jQuery("Document"). ready(Function(){ html5Lightbox.showLightbox(4, 'http://player.vimeo.com/video/1084537', 'Big Buck Bunny'); });

The Vimeo code came from another question that has just below the answer to activate the effect for image and youtube video, I used the code using a Function, then I put in html the "onclick" to activate the effect, but depending on what you have doing can be the "onmouseover", for example...

^_^