Skip to content

Instantly share code, notes, and snippets.

@felipelavinz
Created March 19, 2013 19:13
Show Gist options
  • Save felipelavinz/5199211 to your computer and use it in GitHub Desktop.
Save felipelavinz/5199211 to your computer and use it in GitHub Desktop.
Cover embed objects when using a lightbox image. It works by creating an iframe behind the lightbox div, with the same dimensions as that.
jQuery(document).ready(function($){
$('.lightbox-img').fancybox({
cyclic: true,
index: 0,
onStart: function(){
},
onComplete: function(){
var wrap = $('#fancybox-wrap'),
outer = $('#fancybox-outer'),
width = outer.width(),
height = outer.height();
$('#fancybox-cover-embed').remove();
wrap.append('<iframe id="fancybox-cover-embed">');
outer.css('z-index', 100);
$('#fancybox-cover-embed').css({
'width': width,
'height': height,
'position': 'absolute',
'top': 20,
'left': 20,
'background': '#fff',
'z-index' : 5,
'border': 0
});
},
onClosed: function(){
$('#fancybox-cover-embed').remove();
}
});
});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment