Hallo,
auf meiner Seite wird ein Bild mit klickbaren Bereichen (als Template eingebunden) angezeigt. Einer dieser Bereiche verweist auf ein Bild, welches in einer lightbox angezeigt werden soll.
Momentan öffnet sich eine Seite mit schwarzem Hintergrund inkl. des angesteuerten Bildes - allerdings fehlt die "Schließen-Option".
Hat jemand eine Idee für den Aufruf einer lightbox aus dem Template?
Dankeschön
So sieht der Link in dem svg-template aus:
HTML-Code:
<a class="lightbox" xlink:href="files/werum/img/events/virtualshow/test-journey_blau_2000.png" data-lightbox="">
<polygon style="opacity:0.03;fill:#FFFFFF;" points="508,252 318,250 220,291 220,64 734,100 738,204 552,194 "/>
</a>
j_colorbox.html5:
HTML-Code:
<script>
(function($) {
$(document).ready(function() {
// Die Seite mit der Klasse "lightbox" als Lightbox in der Navi öffen
$('a.lightbox').attr('data-lightbox', "");
//externe Seiten
$("a.external").colorbox({
iframe :true,
width: "80%",
height: "80%"
});
$('a[data-lightbox]').map(function() {
$(this).colorbox({
// Put custom options here
loop: false,
rel: $(this).attr('data-lightbox'),
maxWidth: '95%',
maxHeight: '95%'
});
// next lines are new
if($(this).hasClass('colorbox_content')){
$(this).colorbox({inline:true});
} else {
$(this).colorbox({inline:false});
}
//end
});
});
})(jQuery);
</script>
Lesezeichen