diff --git a/addons/website/static/src/js/content/snippets.animation.js b/addons/website/static/src/js/content/snippets.animation.js
index 9a7b4ee8c14..c303d0691d3 100644
--- a/addons/website/static/src/js/content/snippets.animation.js
+++ b/addons/website/static/src/js/content/snippets.animation.js
@@ -710,7 +710,15 @@ registry.backgroundVideo = publicWidget.Widget.extend({
             }
         }
 
-        $(window).on('resize.' + this.iframeID, _.throttle(() => this._adjustIframe(), 50));
+        var throttledUpdate = _.throttle(() => this._adjustIframe(), 50);
+
+        var $dropdownMenu = this.$el.closest('.dropdown-menu');
+        if ($dropdownMenu.length) {
+            this.$dropdownParent = $dropdownMenu.parent();
+            this.$dropdownParent.on('shown.bs.dropdown.backgroundVideo', throttledUpdate);
+        }
+
+        $(window).on('resize.' + this.iframeID, throttledUpdate);
 
         return Promise.all(proms).then(() => this._appendBgVideo());
     },
@@ -720,6 +728,10 @@ registry.backgroundVideo = publicWidget.Widget.extend({
     destroy: function () {
         this._super.apply(this, arguments);
 
+        if (this.$dropdownParent) {
+            this.$dropdownParent.off('.backgroundVideo');
+        }
+
         $(window).off('resize.' + this.iframeID);
 
         if (this.$bgVideoContainer) {
@@ -738,6 +750,8 @@ registry.backgroundVideo = publicWidget.Widget.extend({
      * @private
      */
     _adjustIframe: function () {
+        this.$iframe.removeClass('show');
+
         // Adjust the iframe
         var wrapperWidth = this.$target.innerWidth();
         var wrapperHeight = this.$target.innerHeight();
@@ -755,6 +769,9 @@ registry.backgroundVideo = publicWidget.Widget.extend({
             style['top'] = '0';
         }
         this.$iframe.css(style);
+
+        void this.$iframe[0].offsetWidth; // Force style addition
+        this.$iframe.addClass('show');
     },
     /**
      * Append background video related elements to the target.
diff --git a/addons/website/static/src/xml/website.background.video.xml b/addons/website/static/src/xml/website.background.video.xml
index 548ce2aabb2..18c1f4bdba6 100644
--- a/addons/website/static/src/xml/website.background.video.xml
+++ b/addons/website/static/src/xml/website.background.video.xml
@@ -8,7 +8,7 @@
                 </div>
             </div>
             <iframe t-att-id="iframeID"
-                    class="o_bg_video_iframe"
+                    class="o_bg_video_iframe fade"
                     frameBorder="0"
                     t-att-src="videoSrc"/>
         </div>