Make fancybox appear on top

jquery fancybox
Jordan picture Jordan · Apr 15, 2011 · Viewed 9.3k times · Source

I have set up a link to an image using fancybox but when I click on the thumbnail the fancybox box appears behind all my content. I have been using z-index to place other content in the page so I think I need to do the same for the fancybox but I don't know where to place the css code?

Answer

tomsseisums picture tomsseisums · Apr 15, 2011

Fancybox has it's own CSS file, and you should look for #fancybox-wrap and change it's z-index'es there. But anyways, it has pretty high setting by default (1101 on mine), therefore I'd suggest altering your own HTML/CSS.

Just in case, check if you have added that fancybox stylesheet in your HTML.

Related questions

How to launch jQuery Fancybox on page load?

I would like to launch a Fancybox (e.g. Fancybox's version of a modal or light box) on page load. I could bind it to a hidden anchor tag and fire the click event of that anchor tag via JavaScript, …

Read More
close fancy box from function from within open 'fancybox'

Hi all i want to be able to close fancyBox when it is open from within. I have tried the following but to no avail: function closeFancyBox(html){ var re = /.*Element insert complete!.*/gi; if( html.search( re ) == 0 ){ $.fancybox.close(); //…

Read More
Open fancybox from function

I am trying to open a fancybox from a function I have - in short my HTML code looks like this; <a href="#modalMine" onclick="myfunction(this); return false;"> click </a> and a part of my …

Read More