Skip to content

silentbox-is-opened class isn’t removed after closing silentbox #73

Description

@svossen

I’m using silentbox 3.0.4 in a Nuxt 3 app. When I open the silentbox and then close it with the close button or the escape key, the class silentbox-is-opened isn’t removed from the body element. The silentbox-overlay-hidden event isn’t fired either. I attached a screencap of this.

plugins/silent-box.ts:

import VueSilentbox from "vue-silentbox";
import "vue-silentbox/dist/style.css";

export default defineNuxtPlugin((nuxtApp) => {
  nuxtApp.vueApp.use(VueSilentbox);
});

app.vue (with options API, I can’t get silentbox working with composition API)

<template>
  <button type="button" @click.native="openSilentbox">Open silentbox</button>
  <silent-box
    @silentbox-overlay-hidden="hideTest"
    @silentbox-overlay-opened="openTest"
  />
</template>

<script>
export default {
  data() {
    return {
      images: [
        {
          src: "https://placehold.co/600x400",
        },
      ],
    };
  },
  methods: {
    openSilentbox() {
      this.$silentbox.open(this.images[0]);
    },
    hideTest() {
      console.log("hide");
    },
    openTest() {
      console.log("open");
    },
  },
};
</script>
Kapture.2023-08-23.at.16.49.10.mp4

Activity

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Projects

    No projects

      Milestone

      No milestone

      Relationships

      None yet

      Development

      No branches or pull requests

      Issue actions