Search code examples
javascriptfancyboxfancybox-3

"back" behaviour with fancybox3


I've been using fancybox for quite a while now and only recently decided to try out fancybox3. I really enjoy fb3, but something is very strange to me.

After opening a gallery made with <a data-fancybox="mygroup">IMAGE STUFF HERE</a> fancybox is adding hashes to the URL in the browser (chrome, ff, edge, safari) eg. example.com/gallery.html#mygroup-8

When I now press the back button in my browser (or a button with javascript:history.back) it will not go back to the last page but instead will open the gallery again with the last image I viewed - which is obviously not what I wanted.

FB2 didn't do that, so I'm kinda wondering how I get rid of that but I couldn't find anything in the docs about this "problem"

Or is it about the code? I'm using this, more or less:

<div class="galwrapper">
 <a href="MY_FULL_IMAGE" data-fancybox="mygroup">
  <div class="galimg" style="background-image:url(MY_THUMBNAIL)"></div>
 </a>
 <a>....</a>
</div>

I'm using fancybox 3.0


Solution

  • Well, it seems I haven't read the docs enough.

    According to this issue from the official fancybox repo it's possible to disable the "hash module" - the culprit behind adding hashes for the history - with this one-liner $.fancybox.defaults.hash = false;