Photoswipe: Let image flow under pswp__top-bar, and still fill window height?

[jamminjames]

I'd like the images to float to the top, under the top-bar, instead of being held below the top-bar. For small displays, this would be better, as the image will be larger. The top bar is semi-transparent when visible, and is hidden completely when there is no mouse over it, so this would be fine.

However, when I try a negative bottom margin for the top-bar, the image does go to the top, but it no longer fills the screen. I believe this is because the image size is calculated by the js, as part of the responsiveness of the application. How can I compensate for the image going under the top-bar, so that it fills the window?

Thanks for any help.

[dimsemenov]

barsSize: {top:0, bottom:'auto'} ? http://photoswipe.com/documentation/options.html

[jamminjames]

That doesn't do it, the image is still being reduced to the size it would need to be to fit under the top bar - see the attached image. Notice the big space between the image and the caption - that stays the same, no matter the size of the browser window. (If the css hadn't been changed to bring the image up, it would be the correct size to fit between the top bar and the caption.) Also, notice the 'element' tag on the right - the image div is being reduced to that size by the javascript somehow, I think. So, regardless of what css changes you make, it will stay that size. That's what needs to be changed.

Perhaps it has to do with the 'setImageSize' function in photoswipe.js?

Also, I your suggested css, at least by itself, does not bring the image up, but this does: .pswp__img: margin-top: -44px;}

[jamminjames]

Okay, never mind, your suggestion works... thanks!