# CMS Filter Affecting My Video Element

**URL:** <https://forum.finsweet.com/t/cms-filter-affecting-my-video-element/5434>\
**Category:** Attributes\
**Tags:** cmsfilter, attributes-v2\
**Created:** [July 11, 2025, 6:44am UTC](https://forum.finsweet.com/t/cms-filter-affecting-my-video-element/5434 "2025-07-11T06:44:02Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![lovebrian649](https://dub1.discourse-cdn.com/flex013/user_avatar/forum.finsweet.com/lovebrian649/32/112_2.png) [@lovebrian649](https://forum.finsweet.com/u/lovebrian649)\
**Post date:** [July 11, 2025, 6:44am UTC](https://forum.finsweet.com/t/cms-filter-affecting-my-video-element/5434/1 "2025-07-11T06:44:02Z")

</div>

## Description

Hi there,

I’m using the V2 Filter and I have a videos on my page using the custom element. Here is the code that gets them to pause and have sound on click.

However, when I click on the filters the second and third time, the video stops behaving as usual. They still work and play/pause on click but they don’t loop automatically like on page load?

I’m under an NDA so I can’t share a read-only publicly, but didn’t know who to DM and was hoping someone might have an answer in the forum first

```auto
<script>
$(".my-video").each(function () {
  const $wrap = $(this); // .my-video wrapper
  const $video = $wrap.find(".my-video_video");
  const $playBtn = $wrap.find(".my-video_play-btn");
  const $closeBtn = $wrap.find(".my-video_close-btn");
  const videoEl = $video.get(0);

  // --- factor the “shrink & reset” work into one reusable function ----------
  function shrinkAndLoop () {
    $wrap.addClass("shrink");
    $video.prop({ muted: true, loop: true });
    videoEl.currentTime = 0;
    videoEl.play(); // keep it running silently in a loop
    $playBtn.removeClass("is-playing");
    $closeBtn.removeClass("is-playing");
  }

  // 1) when the video naturally ends
  $video.on("ended", shrinkAndLoop);

  // 2) when the whole .my-video element scrolls out of view
  const observer = new IntersectionObserver(entries => {
    entries.forEach(entry => {
      if (!entry.isIntersecting && !$wrap.hasClass("shrink")) {
        shrinkAndLoop();
      }
    });
  }, { threshold: 0 }); // callback fires once the element is 0 px in view

  observer.observe($wrap[0]);

  // 3) manual toggle on click (unchanged behaviour)
  $wrap.on("click", function () {
    $wrap.toggleClass("shrink");

    if ($wrap.hasClass("shrink")) {
      // silent looping “thumbnail” mode
      $video.prop({ muted: true, loop: true });
      $playBtn.removeClass("is-playing");
      $closeBtn.removeClass("is-playing");
    } else {
      // full-screen playback mode
      $video.prop({ muted: false, loop: false });
      videoEl.currentTime = 0;
      videoEl.play();
      $playBtn.addClass("is-playing");
      $closeBtn.addClass("is-playing");
    }
  });
});
</script>

```

## Site URL

NDA

## Steps to Reproduce

1. [First step]
2. [Second step]
3. [Third step]  
…

## Expected Behavior

The videos to keep looping regardless of playing with audio as normal

## Actual Behavior

The videos play with on click as normal and go muted on second click, but didn’t start looping once I interact with the cms filters

## Video/Screenshots

NDA

## Additional Context

> _NDA Notice:_ If you’re under an NDA, please feel free to send us a Direct Message/Email with the above information.

---

<div class="post-metadata">

**Author:** ![Support-Pedro](https://dub1.discourse-cdn.com/flex013/user_avatar/forum.finsweet.com/support-pedro/32/6470_2.png) [@Support-Pedro](https://forum.finsweet.com/u/Support-Pedro)\
**Post date:** [July 14, 2025, 6:17am UTC](https://forum.finsweet.com/t/cms-filter-affecting-my-video-element/5434/2 "2025-07-14T06:17:04Z")

</div>

Hi @lovebrian649!  
You can send the Webflow read-only to me, my DMs are open!

---

<div class="post-metadata">

**Author:** ![lovebrian649](https://dub1.discourse-cdn.com/flex013/user_avatar/forum.finsweet.com/lovebrian649/32/112_2.png) [@lovebrian649](https://forum.finsweet.com/u/lovebrian649)\
**Post date:** [July 16, 2025, 12:47am UTC](https://forum.finsweet.com/t/cms-filter-affecting-my-video-element/5434/3 "2025-07-16T00:47:26Z")

</div>

Hi @Support-Pedro

Sorry for the delayed response…I was actually able to find a workaround using tabs instead of a filter