Tomasz Tomasz - 1 month ago 21
HTML Question

Open fancybox onclick using jQuery

I have structure like this:

<div class="grid-item" style="position: absolute; left: 0px; top: 0px;">
<a class="fancybox-button" rel="fancybox-button" href="http://res.cloudinary.com/djxgexgng/image/upload/q_auto:eco/v1/tiltkomp/gallery/bodnar.jpg">
<img src="http://res.cloudinary.com/djxgexgng/image/upload/c_thumb,q_auto:good,w_900/v1/tiltkomp/gallery/bodnar.jpg" alt="bodnar" data-tag="shop all ">
</a>
<div class="img-bg">
<i class="fa fa-search-plus" aria-hidden="true"></i>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. .</p>
</div>
</div>


how to open fancybox after click on
<i class="...>
?

Answer

Simple way (if you use jQuery): You can make a click on "fancybox-button" (it will open fancybox), when you will click on i element. For example:

$("i.fa-search-plus").click( function() {
    $(this).parent().parent().find('a.fancybox_button').click();
});