There are plenty of variations to this question, but none of them seem to help. I am looking for a way to trigger fancybox from a div. Here is the div in question:
<div class="port web">Website</div>
This particular div has some CSS styles applied to it:
.web {
font-size: 80px;
color: rgba(255,0,0,.8);
font-family: 'Luckiest Guy', cursive;
}
I want to be able to open a fancy box when clicking on the .web div. Although I have some basic knowledge of jQuery, my attempt to place the div inside a fancybox anchor was unsuccessful. Could someone guide me on how to achieve this? Thank you.
<a class="fancybox" rel="group" href="image/bg.jpg"><div class="port web">Website</div><img src="small_image_1.jpg" alt=""></a>
$(document).ready(function() {
$('.web').animate({left:'12.5em', top:'6.5em'}, 3500);
});