swiperjs不滑过iframe

发布于 2025-02-06 17:43:06 字数 1304 浏览 1 评论 0原文

我已经在nuxtjs中实现了swiper。我必须在幻灯片中以iframe的形式嵌入广告。但是我的刀刀抓住了iframe。它没有在iframe上滑动。 我尝试在iframe中添加滚动='no',但这无效。 的事件

我也想达到iframe我的代码

      new Swiper(this.$refs.swiper, {
        slidesPerView: 'auto',
        spaceBetween: 20,
        centeredSlidesBounds: true,
        centerInsufficientSlides: true,
        watchSlidesProgress: true,
        watchSlidesVisibility: true,
        direction: 'horizontal',
        mousewheel: true,
        observer: true,
        observeParents: true,
        freeMode: true,
        parallax: true,
        initialSlide: slideNumber,
        keyboard: {
          enabled: true
        },
        scrollbar: {
          el: '.swiper-scrollbar',
          draggable: true
        },
        loopFillGroupWithBlank: false,
        pagination: {
          clickable: true
        },
        autoHeight: true,
        modules: 'modules',
        on: {
          activeIndexChange: function (swiper) {
            vm.listenAds()
            setTimeout(() => {
              swiper.params.centeredSlides = true
              swiper.update()
            }, 100)
          },
          afterInit: function (swiper) {
            setInterval(() => {
              swiper.update()
            }, 100)
          }
        }

      })
    }```

I have implemented Swiper in NuxtJs. I have to embed ads in the form of iFrame in slides. But my swiper stuck at iFrame. It is not sliding over the iframe.
I have tried adding scrolling='no' to the iframe, but it didn't work.
Also I want to hit the events of the iframe

My Code

      new Swiper(this.$refs.swiper, {
        slidesPerView: 'auto',
        spaceBetween: 20,
        centeredSlidesBounds: true,
        centerInsufficientSlides: true,
        watchSlidesProgress: true,
        watchSlidesVisibility: true,
        direction: 'horizontal',
        mousewheel: true,
        observer: true,
        observeParents: true,
        freeMode: true,
        parallax: true,
        initialSlide: slideNumber,
        keyboard: {
          enabled: true
        },
        scrollbar: {
          el: '.swiper-scrollbar',
          draggable: true
        },
        loopFillGroupWithBlank: false,
        pagination: {
          clickable: true
        },
        autoHeight: true,
        modules: 'modules',
        on: {
          activeIndexChange: function (swiper) {
            vm.listenAds()
            setTimeout(() => {
              swiper.params.centeredSlides = true
              swiper.update()
            }, 100)
          },
          afterInit: function (swiper) {
            setInterval(() => {
              swiper.update()
            }, 100)
          }
        }

      })
    }```

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。
列表为空,暂无数据
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文