-
Notifications
You must be signed in to change notification settings - Fork 57
Description
Hi,
First of all, amazing grid and thank you for sharing.
Now, the problem. I am using this grid and when I click the image it pops up and everything is good, but when I scroll it the pop up with the original image and the details scrolls and don't stay on top. Or when I scroll down the grid and click an image that is way down on the grid I get a black screen unless I scroll to the top of the page where the pop up preview is stuck. I want it so that when I click the image it does not scroll, and when I look at your demo it works and on mine it scrolls.
(Everything is good until....) (... you scroll and the black at the bottom shows up.) (P.S. Ignore the spelling error in the image. ;P)I think I know where the problem lies, but don't know how to fix it. So here is where I think it is.
Since I am using another Tympanus theme called "Page Stack" and that theme is not scrollable and I wanted to use your grid theme (which needs scroll), I made it scrollable by writing page.style.overflow = 'scroll'; into the following javascript for the navigation.
for(var i = 0; i < pagesTotal; ++i) {
var page = pages[i],
posIdx = stackPagesIdxs.indexOf(i);
if( current !== i ) {
classie.add(page, 'page--inactive');
if( posIdx !== -1 ) {
// visible pages in the stack
page.style.WebkitTransform = 'translate3d(0,100%,0)';
page.style.transform = 'translate3d(0,100%,0)';
}
else {
// invisible pages in the stack
page.style.WebkitTransform = 'translate3d(0,75%,-300px)';
page.style.transform = 'translate3d(0,75%,-300px)';
}
}
else {
classie.remove(page, 'page--inactive');
page.style.overflow = 'scroll';
}
Now I don't know how to make it so that when the image preview opens page.style.overflow = 'scroll'; disables. I tried putting page.style.overflow = 'hidden'; in the javascript for the grid. I also tried page.style.height = 'initial';. So what should I change in the javascript to make it not scroll?
Here is the link to the live "website". The grid located in the menu under photos.

