I want to do a couple of things in fancy box - > I am using it to fire an AJAX function,the recieved content from server, little problem is ->

1. It is not auto scrolling, am getting a scroll and am able to scroll but cannot scroll it using the touchpad.

2. i want to fix the position of it on the screen, it is moving if i scroll the page in backgroung.

Following is some CSS code, help me what to add in it.

width:720px;
height:380px;
float:left;
overflow-y:scroll;

Thanks :)

I want to do a couple of things in fancy box - > I am using it to fire an AJAX function,the recieved content from server, little problem is ->

1. It is not auto scrolling, am getting a scroll and am able to scroll but cannot scroll it using the touchpad.

2. i want to fix the position of it on the screen, it is moving if i scroll the page in backgroung.

Following is some CSS code, help me what to add in it.

width:720px;
height:380px;
float:left;
overflow-y:scroll;

Thanks :)

• javascript
• jquery
• scroll
• position
• fancybox

Share Improve this question Follow edited Aug 23, 2011 at 13:29 Reporter 3,93655 gold badges3535 silver badges4949 bronze badges asked Aug 23, 2011 at 13:28 saurabhsaurabh 1111 silver badge22 bronze badges

Add a ment  | 

2 Answers 2

Sorted by: Reset to default 3

Try adding this to your css

body #fancybox-wrap { position: fixed; }

It is necessary to set also a top distance, otherwise Fancybox calculates it from the top and if the container is fixed it will go out of the screen.

Furthermore, it is necessary to set it as !important in order to overwrite inline css:

#fancybox-wrap {
    top: 100px !important;
}