Wexley gallery lightbox too small!

Hi,

The click through lightbox from the Wexley gallery only displays the image at a small size. I'm looking to find a way to make it closer to full screen to improve the impact for the viewer. I have seen the thread about hiding the header, this helps but doesn't solve the problem.

Can anyone help? I know others are looking for this answer too!

Many thanks

Hi. I wondered if you found a solution? I would also like the lightbox to be larger but without losing the site header. There seems to be extra space at the bottom and I could reduce the margin at the top a little if it helps.

Hey, I ended up using one of SS's recommended coders. She was great, and eventually we found a fix. Or at least what I feel was a fix - check out my site to see if it helps as a reference:

www.matthewjoseph.co.uk

hi MatthewGreat page you have!I would very much like to know how you fixed the full screen?Like the idea to use the whole window.

thanksBest regardsLars

You could try the below - I paid for a developer to help me with it and this is what we put in the custom CSS. May need some tweaks etc for your site.

// fix header to top #headerWrapper { position: fixed; top: 0; right: 0; left: 0; bottom: auto; background: rgba(240,242,239,0.5); padding-top: 20px; } #page { padding-top: 2PX }

// move main gallery tns down so they dont overlap the header
.collection-type-gallery .thumb-list {
   margin-top: 100px;
}

// when gallery lightbox is active
.collection-type-gallery.full-view {
  #logo,
  #topNav {
    display: none;
  }
 #headerWrapper {
   background: transparent;
 }

 #backToThumbs {
  font-size: 2.0em;
  top: 10px;
  right:20px;    
     }
}

// keep ligthbox full width/height
.collection-type-gallery.full-view #slideshowWrapper {
 height: 90vh !important;
}
.sqs-gallery-design-stacked-slide img {
 width: auto !important;
 height: auto !important;
 height: 100% !important;
 max-height: 1335px !important;
 top: 50% !important;
 left: 50% !important;
 -o-transform: translateY(-50%) translateX(-50%) !important;
 -ms-transform: translateY(-50%) translateX(-50%) !important;
 -moz-transform: translateY(-50%) translateX(-50%) !important;
 -webkit-transform: translateY(-50%) translateX(-50%) !important;
 transform: translateY(-50%) translateX(-50%) !important;
}

#topNav nav .folder-collection .subnav {
  background-color: rgba(240,242,239,0.5) !important;
}
 #topNav nav .folder-collection .subnav {
  background-color: #eef0eb !important;
}