Lightbox closes after scrolling horizontally

Hello. After the horizontal scroll lightbox closed. How to fix?
http://as-style.webflow.io/works
http://joxi.ru/bmokMbETMq7Dym
https://preview.webflow.com/preview/as-style?preview=3839b2c38841535a8f3acf62f1514000

Hi @semenkov, What OS and browser are you using?

I am not experiencing the issue with the lightbox closing when scrolling the thumbnail images in Safari, Firefox or Chrome on my Mac.

I am curious why you chose to use an external lightbox wowslider as an embed rather than using Webflow’s lighbox?

The problem in browsers Chrome, Yandex, Opera. No problem in Firefox and IE
http://iqlanding.ru/error.mp4
After loading site on my hosting problem remained http://as-stil.ru/gallery

Hi @semenkov, thanks for the report. I am also taking a look at this. More info to be updated as it is available.

Thanks in advance!

Hi @semenkov, thanks for your patience. I have tested your site with Latest chrome, firefox, safari, opera, yandex and IE, but I am unable to reproduce the same issue.

May I ask what size monitor you are using, and the type of computer and operating system?

Hi. Windows 7 64 bit 1920*1080 px
http://joxi.ru/n2Yn60ghjBV4kA
https://preview.webflow.com/preview/as-style?preview=3839b2c38841535a8f3acf62f1514000

Hi @cyberdave,

I can confirm this happens on Win 10, Chrome dev-latest (51.0.2700.0 dev-m).

When opening a lightbox with image thumbnails that overflow the body width, the horizontal scrollbar will be hidden at first, but you will be able to scroll down slightly which reveals it.

There is a jQuery “tap” event that has to be unset on the w-lightbox-strip.

Hi @samliew, @semenkov, thanks for the update. Yes, I have reproduced this issue on windows 7, 8, 8.1 and Windows 10.

I am unable to reproduce on mac.

I am still investigating, and will have the engineering team take a look during support hours. Once there is more info, I will get back with an update.

Hi. The problem is that after a horizontal band scrolling, lightbox closes (after releasing the left mouse button)

I have a temporary solution, paste into the Site Settings > Custom Code > Footer Code:

CSS

<style>
.w-lightbox-strip {
  margin-bottom: -20px;
}
</style>

JS

<script>
var Webflow = Webflow || [];
Webflow.push(function() {

  // Hack to keep current lightbox thumbnail centered
  ii = setInterval(function() {
    var $track = $('.w-lightbox-strip');
    var $item = $track.find('.w-lightbox-active');
    if($track.length != 0 && $item.length != 0) {
      $track.scrollLeft($track.scrollLeft() + $item.position().left
        - $track.width()/2 + $item.width()/2);
    }
  }, 400);
});
</script>

Scrollbar bug fixed demo here: http://flickrsearch.webflow.io (do a search and click on image for lightbox)

2 Likes

Bump. I believe this is still valid.

3 Likes

this solution hasnt worked. webflow team should correct this because it’s a payed tool…

Having this issue with Chrome/Firefox on windows 10. 27inch monitor.

@semenkov @vlogic @samliew @dayanne @William_Burgess

We pushed a fix for this!! Thank so much for your patience!

1 Like