0

Tenho uma imagem que estou mapeando e quero colocar um link em alguns pontos, só que ao clicar nestes pontos eu quero que abra uma janela utilizando algum plugin jquery (tipo lightbox), para dar um efeito melhor, vejam o codigo que estou usando:

<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>

Sendo que o lightbox que estou usando funciona somente se uma tag IMG estiver dentro de uma tag A.

Ajudem!

1 Resposta 1

0

Eu achei a resposta no site em que eu abaixei o plugin: https://html5box.com

Na parte onde tem "recently asked questions", tem uma pergunta sobre como ativar o efeito usando javascript, abaixo os códigos para abrir imagem, video do youtube e video do vimeo:


PARA IMAGEM:

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


VIDEO DO YOUTUBE:

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


VIDEO DO VIMEO:

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


O codigo do vimeo veio de uma outra pergunta que tem logo abaixo da resposta para ativar o efeito para imagem e para o video do youtube, eu usei o codigo utilizando uma function, dai coloquei no html o "onclick" para ativar o efeito, mas dependendo do que você tiver fazendo pode ser o "onmouseover", por exemplo...

^_^

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .