fancybox
Posted in
7
2:44 am, September 4, 2021
fancybox load iframe inline
All you need to load content in an iframe using fancybox modal javascript plugin.
not quite an inline load, but not much script to get this going.
HTML
<a data-fancybox="iframe" data-src="https://kruxor.com/" data-type="iframe" href="https://kruxor.com/" id="iframecontent">
Click this to load the iframe.
</a>
CSS
a {
color:#999;
font-weight:bold;
}
Scripts
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/fancybox/3.5.7/jquery.fancybox.min.css" integrity="sha512-H9jrZiiopUdsLpg94A333EfumgUBpO9MdbxStdeITo+KEIMaNfHNvwyjjDJb+ERPaRS6DpyRlKbvPUasNItRyw==" crossorigin="anonymous" referrerpolicy="no-referrer" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js" referrerpolicy="no-referrer"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/fancybox/3.5.7/jquery.fancybox.min.js" integrity="sha512-uURl+ZXMBrF4AwGaWmEetzrd+J5/8NRkWAvJx5sbPSSuOb0bZLqf+tOzniObO00BjHa/dD7gub9oCGMLPQHtQA==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
Javascript
$.fancybox({
src : '#iframecontent',
type : 'iframe',
});
View Statistics
This Week
55
This Month
299
This Year
0
Add Comment
Other Items in fancybox
Related Search Terms
Other Categories in Code
c testing apache apps asp bat bootstrap bootstrap templates core css css grid design elements fancybox fonts foundation framework gimp git html icons ideas images javascript jquery js linux mac nginx node php php functions php simple html dom pi400 python react sections site bugs site documentation sql sqlite sublime svg templates tools virtual box webdev windows wordpress