Vanilla 2

BL1

I noticed that on screen resize (when I pull the browser window wider after launching a image gallery) the dimmed overlay does not resize with the screen. You can see this in your own demo:

Demos
* Image Gallery.
Launch the demo then pull the browser window wider. The dimmed background image remains at original window size. This looks odd as most people are resizing their browser windows constantly.

Operating systems latest versions of MAC OSX and and PC (WINDOWS 7)

All browsers that I tested. Latest version of firefox, safari, google chrome, explorer.
Safari 5.0.3 (the new Safari 5.0.35 -- poses new set of overlay issues -- Ill make a new thread for that issue)

What can we fix in the css or javascript to allow the dimmed overlay image to automatically resize on browser width change?

P.S. --- I love this App. Thank you for all your hard work!

valerian

The problem seems to be in the function _resize_overlay() which only resizes the height and not the width :

function _resize_overlay() {
windowHeight = $(window).height(), windowWidth = $(window).width();
if(typeof $pp_overlay != "undefined") $pp_overlay.height($(document).height());
};

I fixed it this way :

function _resize_overlay() {
windowHeight = $(window).height(), windowWidth = $(window).width();
if(typeof $pp_overlay != "undefined") {
$pp_overlay.height($(document).height());
$pp_overlay.width($(document).width());
}
};

vse

Thanks for the fix valerian... I noticed a javascript error though when using your fix (it did not like $pp_overlay being called twice), so I tweaked it a tiny bit to solve the error I was seeing.

function _resize_overlay() {
windowHeight = $(window).height(), windowWidth = $(window).width();
if(typeof $pp_overlay != "undefined") {
$pp_overlay.height($(document).height()).width($(document).width());
}
};

valerian

Sadly it seems that it is not the only problem with resizing, i also have really strange behavior when trying to scroll the page after a resize of the window, the lightbox is wrongly centered and goes out of the window !

ashcrayon

Hi,

I have a single page, horizontal scrolling website I'm working on here:

www.djstevelawler.com/summer2011

it totals to 28999px wide.

When I scroll past the first few photo sets and select an image to view in the prettyphoto style it only appears in the first instance of the webpage (at the very beginning of the scroll).

Do you know how I can center the pop up on the screen to wherever I am positioned along the site and how to have the grey bg overlay the entire width of the site?

I'm very pushed for time. Need it for tomorrow so any help would be greatly appreciated :(

thanks

Vanilla 2

Howdy, Stranger!

Categories