From 56f6d62324e7d29b4ba6083f1bc23ad49e514786 Mon Sep 17 00:00:00 2001
From: qsm-odoo <qsm@odoo.com>
Date: Mon, 9 Dec 2019 12:24:00 +0000
Subject: [PATCH] [FIX] website: restore parallax design

Commit https://github.com/odoo/odoo/commit/cf5b3e1db5d312133eb1af7ff0d5471db47987e5
fixed a problem by creating another one: the parallax with a given speed
appeared broken on page load (which is even more visible in 13.0 with
lazy loading).

This commit restores the design and solves the original problem.

closes odoo/odoo#41594

X-original-commit: a9aa72ecb5350cc0e9fa5b6a17d4db8d2f1895fd
Signed-off-by: Quentin Smetz (qsm) <qsm@odoo.com>
---
 .../static/src/js/content/snippets.animation.js       | 11 ++++-------
 addons/website/static/src/scss/website.scss           |  6 ++++++
 2 files changed, 10 insertions(+), 7 deletions(-)

diff --git a/addons/website/static/src/js/content/snippets.animation.js b/addons/website/static/src/js/content/snippets.animation.js
index 0d1ed0f604c..634470a5993 100644
--- a/addons/website/static/src/js/content/snippets.animation.js
+++ b/addons/website/static/src/js/content/snippets.animation.js
@@ -516,7 +516,6 @@ registry.parallax = Animation.extend({
     destroy: function () {
         this._super.apply(this, arguments);
         $(window).off('.animation_parallax');
-        this.$target.css('overflow', '');
     },
 
     //--------------------------------------------------------------------------
@@ -544,18 +543,19 @@ registry.parallax = Animation.extend({
             this.$bg.css('background-image', urlTarget);
         }
         this.$target.css('background-image', 'none');
-        this.$target.css('overflow', '');
 
         // Get parallax speed
         this.speed = parseFloat(this.$target.attr('data-scroll-background-ratio') || 0);
 
         // Reset offset if parallax effect will not be performed and leave
         this.$target.toggleClass('s_parallax_is_fixed', this.speed === 1);
-        if (this.speed === 0 || this.speed === 1) {
+        var noParallaxSpeed = (this.speed === 0 || this.speed === 1);
+        this.$target.toggleClass('s_parallax_no_overflow_hidden', noParallaxSpeed);
+        if (noParallaxSpeed) {
             this.$bg.css({
                 transform: '',
                 top: '',
-                bottom: ''
+                bottom: '',
             });
             return;
         }
@@ -571,9 +571,6 @@ registry.parallax = Animation.extend({
             top: -this.ratio,
             bottom: -this.ratio,
         });
-        // TODO this introduces a limitation: no dropdown will be able to
-        // overflow. Maybe there is a better way to find.
-        this.$target.css('overflow', 'hidden');
     },
 
     //--------------------------------------------------------------------------
diff --git a/addons/website/static/src/scss/website.scss b/addons/website/static/src/scss/website.scss
index 874ff081f04..7f55fb60d85 100644
--- a/addons/website/static/src/scss/website.scss
+++ b/addons/website/static/src/scss/website.scss
@@ -922,6 +922,12 @@ table.table_desc tr td {
 .parallax {
     position: relative;
 
+    // TODO this introduces a limitation: no dropdown will be able to
+    // overflow. Maybe there is a better way to find.
+    &:not(.s_parallax_no_overflow_hidden) {
+        overflow: hidden;
+    }
+
     > * {
         position: relative;
     }