Skip to content

Add slug option for Hash plugin #821

@Nisekoi5

Description

@Nisekoi5

Describe the bug

Clicking Start Fancybox and navigating through the pages generates a hash correctly in the address bar.

However, clicking the browser's back button does not close the slideshow; it only records the back action, which is inconsistent with the behavior when using it declaratively.

Reproduction

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width" />
    <link
          rel="stylesheet"
          href="https://cdn.jsdelivr.net/npm/@fancyapps/[email protected]/dist/fancybox/fancybox.css"
          />
  </head>
  <body>
    <div>
      <button id="myButton">
        Start Fancybox
      </button>
    </div>
    <script src="https://cdn.jsdelivr.net/npm/@fancyapps/[email protected]/dist/fancybox/fancybox.umd.js"></script>
    <script>
      document.getElementById("myButton").addEventListener("click", () => {
        Fancybox.show(
          [
            {
              src: "https://lipsum.app/id/1/1800x1200",
              thumbSrc: "https://lipsum.app/id/1/150x100",
              caption: "Sample image #1",
              fancybox: 'gallery',
            },
            {
              src: "https://lipsum.app/id/2/1800x1200",
              thumbSrc: "https://lipsum.app/id/2/150x100",
              caption: "Sample image #2",
              fancybox: 'gallery',
            },
            {
              src: "https://lipsum.app/id/3/1800x1200",
              thumbSrc: "https://lipsum.app/id/3/150x100",
              caption: "Sample image #3",
              fancybox: 'gallery',
            },
          ],
          {
            // Your custom options
          }
        );
      })
    </script>
  </body>
</html>

Additional context

It works normally in 5.x

    Fancybox.show(boxItem,
        {
            Hash: true,
            slug: 'gallery'
 )

In version 5.x, you could simply set the slug option in the options menu. However, this option seems to have been removed in version 6.x. I tried setting the slug in CarouselSlide or fancybox instead, but neither seems to work.

Metadata

Metadata

Assignees

No one assigned

    Labels

    enhancementNew feature or request

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions