the Forum
Fancybox 2 is shifting on load
Posted on September 12, 2012 by Michael Rosario
Total Posts: 33 | Join date: 03-12-11
.fancybox-lock .fancybox-overlay {
overflow: auto;
}
.fancybox-lock {
overflow: hidden;
}
Tags: There are no tags for this entry.
11 answers, add yours below
Posted on on September 17, 2012 at 3:37pm
by Malcolm
I tried to remove the .fancybox-lock class , but still no luck ? Any other ideas what might cause this? Many thanks.
Posted on on September 18, 2012 at 1:59am
by Michael Rosario
If you can provide me an example, I can see whats really going on. Thanks.
Posted on on September 25, 2012 at 8:28am
by joris
body {
margin-right: 0 !important;
}
it's a bit of a hack but this way the inline-style set by fancybox is overruled.
Posted on on September 28, 2012 at 7:30am
by tapas bera
Posted on on February 1, 2013 at 2:34am
by Sergey
body {
width: 960px;
margin: 0 auto;
}
Fixed code:
body {
width: 960px;
margin: 0 auto !important;
}
If you're using isotope filtering or similar solution you might also want to add this:
html {
overflow-y: scroll !important;
}
Posted on on March 20, 2013 at 12:26pm
by Dharmu
Posted on on July 18, 2013 at 3:36pm
by Michael Rosario
.fancybox-lock {
overflow: hidden !important;
width: auto;
}
.fancybox-lock body {
overflow: hidden !important;
}
.fancybox-lock-test {
overflow-y: hidden !important;
}
.fancybox-overlay {
position: absolute;
top: 0;
left: 0;
overflow: hidden;
display: none;
z-index: 99999998010;
background: url('fancybox_overlay.png');
}
.fancybox-overlay-fixed {
position: fixed;
bottom: 0;
right: 0;
}
.fancybox-lock .fancybox-overlay {
overflow: auto;
overflow-y: scroll;
}
To this:
.fancybox-lock {
}
.fancybox-lock body {
}
.fancybox-lock-test {
}
.fancybox-overlay {
position: absolute;
top: 0;
left: 0;
display: none;
z-index: 99999998010;
background: url('fancybox_overlay.png');
}
.fancybox-overlay-fixed {
position: fixed;
bottom: 0;
right: 0;
}
.fancybox-lock .fancybox-overlay {
}
Posted on on July 29, 2013 at 10:16am
by Shady El Gewily
Posted on on December 20, 2013 at 5:30am
by David Sanford
I am hiring a sizing issue, but a whacky one.
My issue is the margin margin (or padding) on the SECOND and subsequent galleries (8 total).
I am using Dreamweaver and while in live view, i do not see the issue.
It is only after i create the .ipa via phone gap do i see the issue on my iOS device.
The first gallery is fine
The second gallery begins the issue (NOTE: that gallery works fine it terms of grouping the photos, only the top margin).
Each subsequent gallery the top error margin increases to the point were the 8th gallery has a large scroll space of nearly triple the size of the image.
Any suggestions?
Posted on on October 25, 2014 at 5:44am
by Manas
This solved my issue out of other 49712394871239 things posted online.
Posted on on January 6, 2015 at 10:57am
by Peter
add your answers here
comments powered by Disqus
Add New Thread
Trending Threads
- How to create a simultaneous search box using HTML/JavaScript?
- Posted on March 13, 2013 by Arnold
2 Replies | Add a Reply
- CarouFredSel is not loading consistently on page reload.
- Posted on April 30, 2013 by Michael Rosario
6 Replies | Add a Reply
- Removing all eventSources in jQuery FullCalendar plugin
- Posted on June 14, 2011 by Michael Rosario
3 Replies | Add a Reply
- How to get a JSON feed with YouTube and parse using Jquery
- Posted on November 2, 2011 by Michael Rosario
1 Reply | Add a Reply
- I’d like to be able to add Facebook, Twitter, Pinterest, and Instagram feeds to my website
- Posted on July 25, 2014 by James
2 Replies | Add a Reply
- Enable GZIP on Pair.com
- Posted on April 4, 2014 by Michael Rosario
2 Replies | Add a Reply
- How to add email collection popup on my website
- Posted on December 1, 2011 by Tony
2 Replies | Add a Reply
- Issue using mediaelement.js with IE7/8 blank video with sound
- Posted on March 16, 2012 by Michael Rosario
3 Replies | Add a Reply