diff --git a/docs/source/_static/firebase_sync_demo.html b/docs/source/_static/firebase_sync_demo.html
index ff6db344..acf6c03f 100644
--- a/docs/source/_static/firebase_sync_demo.html
+++ b/docs/source/_static/firebase_sync_demo.html
@@ -820,33 +820,42 @@
         });
       }
 
-      function fixBase64VideoBackground(event) {
-        // Analyze all slides backgrounds
-        for (const slide of Reveal.getBackgroundsElement().querySelectorAll('.slide-background')) {
-          // Get the slide video and its sources for each background
-          const video = slide.querySelector('video');
-          if (video) {
-            setVideoBase64(video);
-          } else {
-            // Listen to the creation of the video element
-            const observer = new MutationObserver((mutationsList) => {
-              for (const mutation of mutationsList) {
-                if (mutation.type === 'childList') {
-                  for (const addedNode of mutation.addedNodes) {
-                    if (addedNode.tagName === 'VIDEO') {
-                      setVideoBase64(addedNode);
-                      observer.disconnect(); // Stop observing once the video is handled
-                    }
+      const _observedBgSlides = new WeakSet();
+
+      function fixSlideBackground(bg) {
+        if (_observedBgSlides.has(bg)) return;
+        _observedBgSlides.add(bg);
+        const video = bg.querySelector('video');
+        if (video) {
+          setVideoBase64(video);
+        } else {
+          const observer = new MutationObserver((mutationsList) => {
+            for (const mutation of mutationsList) {
+              if (mutation.type === 'childList') {
+                for (const addedNode of mutation.addedNodes) {
+                  if (addedNode.tagName === 'VIDEO') {
+                    setVideoBase64(addedNode);
+                    observer.disconnect();
+                    return;
                   }
                 }
               }
-            });
-            observer.observe(slide, { childList: true, subtree: true });
-          }
+            }
+          });
+          observer.observe(bg, { childList: true, subtree: true });
         }
       }
-      // Setup base64 videos
+
+      function fixBase64VideoBackground() {
+        const backgroundsEl = Reveal.getBackgroundsElement();
+        if (!backgroundsEl) return;
+        for (const bg of backgroundsEl.querySelectorAll('.slide-background')) {
+          fixSlideBackground(bg);
+        }
+      }
+
       Reveal.on( 'ready', fixBase64VideoBackground );
+      Reveal.on( 'slidechanged', fixBase64VideoBackground );
     </script>
   </body>
 </html>
diff --git a/docs/source/_static/template.html b/docs/source/_static/template.html
index adf1c20f..4dc932f2 100644
--- a/docs/source/_static/template.html
+++ b/docs/source/_static/template.html
@@ -311,33 +311,42 @@
         });
       }
 
-      function fixBase64VideoBackground(event) {
-        // Analyze all slides backgrounds
-        for (const slide of Reveal.getBackgroundsElement().querySelectorAll('.slide-background')) {
-          // Get the slide video and its sources for each background
-          const video = slide.querySelector('video');
-          if (video) {
-            setVideoBase64(video);
-          } else {
-            // Listen to the creation of the video element
-            const observer = new MutationObserver((mutationsList) => {
-              for (const mutation of mutationsList) {
-                if (mutation.type === 'childList') {
-                  for (const addedNode of mutation.addedNodes) {
-                    if (addedNode.tagName === 'VIDEO') {
-                      setVideoBase64(addedNode);
-                      observer.disconnect(); // Stop observing once the video is handled
-                    }
+      const _observedBgSlides = new WeakSet();
+
+      function fixSlideBackground(bg) {
+        if (_observedBgSlides.has(bg)) return;
+        _observedBgSlides.add(bg);
+        const video = bg.querySelector('video');
+        if (video) {
+          setVideoBase64(video);
+        } else {
+          const observer = new MutationObserver((mutationsList) => {
+            for (const mutation of mutationsList) {
+              if (mutation.type === 'childList') {
+                for (const addedNode of mutation.addedNodes) {
+                  if (addedNode.tagName === 'VIDEO') {
+                    setVideoBase64(addedNode);
+                    observer.disconnect();
+                    return;
                   }
                 }
               }
-            });
-            observer.observe(slide, { childList: true, subtree: true });
-          }
+            }
+          });
+          observer.observe(bg, { childList: true, subtree: true });
         }
       }
-      // Setup base64 videos
+
+      function fixBase64VideoBackground() {
+        const backgroundsEl = Reveal.getBackgroundsElement();
+        if (!backgroundsEl) return;
+        for (const bg of backgroundsEl.querySelectorAll('.slide-background')) {
+          fixSlideBackground(bg);
+        }
+      }
+
       Reveal.on( 'ready', fixBase64VideoBackground );
+      Reveal.on( 'slidechanged', fixBase64VideoBackground );
       {% endif %}
     </script>
 
diff --git a/manim_slides/templates/firebase_sync.html b/manim_slides/templates/firebase_sync.html
index c0f1dacb..6c2cca2c 100644
--- a/manim_slides/templates/firebase_sync.html
+++ b/manim_slides/templates/firebase_sync.html
@@ -502,33 +502,42 @@
         });
       }
 
-      function fixBase64VideoBackground(event) {
-        // Analyze all slides backgrounds
-        for (const slide of Reveal.getBackgroundsElement().querySelectorAll('.slide-background')) {
-          // Get the slide video and its sources for each background
-          const video = slide.querySelector('video');
-          if (video) {
-            setVideoBase64(video);
-          } else {
-            // Listen to the creation of the video element
-            const observer = new MutationObserver((mutationsList) => {
-              for (const mutation of mutationsList) {
-                if (mutation.type === 'childList') {
-                  for (const addedNode of mutation.addedNodes) {
-                    if (addedNode.tagName === 'VIDEO') {
-                      setVideoBase64(addedNode);
-                      observer.disconnect(); // Stop observing once the video is handled
-                    }
+      const _observedBgSlides = new WeakSet();
+
+      function fixSlideBackground(bg) {
+        if (_observedBgSlides.has(bg)) return;
+        _observedBgSlides.add(bg);
+        const video = bg.querySelector('video');
+        if (video) {
+          setVideoBase64(video);
+        } else {
+          const observer = new MutationObserver((mutationsList) => {
+            for (const mutation of mutationsList) {
+              if (mutation.type === 'childList') {
+                for (const addedNode of mutation.addedNodes) {
+                  if (addedNode.tagName === 'VIDEO') {
+                    setVideoBase64(addedNode);
+                    observer.disconnect();
+                    return;
                   }
                 }
               }
-            });
-            observer.observe(slide, { childList: true, subtree: true });
-          }
+            }
+          });
+          observer.observe(bg, { childList: true, subtree: true });
         }
       }
-      // Setup base64 videos
+
+      function fixBase64VideoBackground() {
+        const backgroundsEl = Reveal.getBackgroundsElement();
+        if (!backgroundsEl) return;
+        for (const bg of backgroundsEl.querySelectorAll('.slide-background')) {
+          fixSlideBackground(bg);
+        }
+      }
+
       Reveal.on( 'ready', fixBase64VideoBackground );
+      Reveal.on( 'slidechanged', fixBase64VideoBackground );
       {% endif %}
     </script>
     {% if env['READTHEDOCS'] %}
diff --git a/manim_slides/templates/revealjs.html b/manim_slides/templates/revealjs.html
index 0fa6b8b3..44bcc280 100644
--- a/manim_slides/templates/revealjs.html
+++ b/manim_slides/templates/revealjs.html
@@ -313,33 +313,42 @@
         });
       }
 
-      function fixBase64VideoBackground(event) {
-        // Analyze all slides backgrounds
-        for (const slide of Reveal.getBackgroundsElement().querySelectorAll('.slide-background')) {
-          // Get the slide video and its sources for each background
-          const video = slide.querySelector('video');
-          if (video) {
-            setVideoBase64(video);
-          } else {
-            // Listen to the creation of the video element
-            const observer = new MutationObserver((mutationsList) => {
-              for (const mutation of mutationsList) {
-                if (mutation.type === 'childList') {
-                  for (const addedNode of mutation.addedNodes) {
-                    if (addedNode.tagName === 'VIDEO') {
-                      setVideoBase64(addedNode);
-                      observer.disconnect(); // Stop observing once the video is handled
-                    }
+      const _observedBgSlides = new WeakSet();
+
+      function fixSlideBackground(bg) {
+        if (_observedBgSlides.has(bg)) return;
+        _observedBgSlides.add(bg);
+        const video = bg.querySelector('video');
+        if (video) {
+          setVideoBase64(video);
+        } else {
+          const observer = new MutationObserver((mutationsList) => {
+            for (const mutation of mutationsList) {
+              if (mutation.type === 'childList') {
+                for (const addedNode of mutation.addedNodes) {
+                  if (addedNode.tagName === 'VIDEO') {
+                    setVideoBase64(addedNode);
+                    observer.disconnect();
+                    return;
                   }
                 }
               }
-            });
-            observer.observe(slide, { childList: true, subtree: true });
-          }
+            }
+          });
+          observer.observe(bg, { childList: true, subtree: true });
         }
       }
-      // Setup base64 videos
+
+      function fixBase64VideoBackground() {
+        const backgroundsEl = Reveal.getBackgroundsElement();
+        if (!backgroundsEl) return;
+        for (const bg of backgroundsEl.querySelectorAll('.slide-background')) {
+          fixSlideBackground(bg);
+        }
+      }
+
       Reveal.on( 'ready', fixBase64VideoBackground );
+      Reveal.on( 'slidechanged', fixBase64VideoBackground );
       {% endif %}
     </script>
     {% if env['READTHEDOCS'] %}