What is Fancy-Box?
A fancy box is a tool for representing images, HTML elements, SWF movies, Iframes, and also Ajax requests in a Mac-style “lightbox” that floats overtop of a web page. Fancy Box means Popup message.
If you want to fancy box using jQuery then follow the below instructions,
Step-1:- Add latest jQuery and fancy Box files
<html> <head> <script src="https://code.jquery.com/jquery-3.3.1.min.js"></script> <link href="https://cdnjs.cloudflare.com/ajax/libs/fancybox/3.5.7/jquery.fancybox.min.css" rel="stylesheet"> <script src="https://cdnjs.cloudflare.com/ajax/libs/fancybox/3.5.7/jquery.fancybox.min.js"></script> </head> </html>
Step-2:- Create links
Create a link element (<a href>) using Image
<a data-fancybox="gallery" href="http://farm4.staticflickr.com/3691/10185053775_701272da37_m.jpg"> <img src="http://farm4.staticflickr.com/3691/10185053775_701272da37_m.jpg"> </a>
The Output Here: