Trevor Dupp
Trevor Dupp

Reputation: 155

Fancybox positioning - can it be positioned relative to the parent div?

I'm working on a project which has a complex element, and I think I can use Fancybox as the solution but I need to use it slightly different then what it was intended.

Normally the fancybox will auto center itself on the screen. What I need to accomplish is to have the fancybox overlay in a very specific spot and for it to stay there no matter how wide the screen is.

Is there a way to rewrite the jquery to set it into a fixed coordinate on the page?

EDIT

Okay so i did the following

#fancybox-wrap {
display: none;
left: 40% !important;
outline: medium none;
padding: 20px;
position: absolute;
top: 100px !important;
z-index: 1101;
right: 61% !important;

}

the motion is nearly perfect, but there is some slight movement when you resize the screen.

any ideas how I can get it really locked in there?

Upvotes: 2

Views: 2366

Answers (1)

Nickfmc
Nickfmc

Reputation: 379

you could put it within a specific div by finding this line in jquery.fancybox.js and change the appendTo to you div of choice, you will need to change the .fancybox-overlay positioning to absolute from fixed in the css also if you want to position it within that div.

this.overlay = $('<div class="fancybox-overlay"></div>').appendTo( ".yourdiv" );

Upvotes: 1

Related Questions