NextERP/design-themes
2
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

[IMP] website_animate: hide horizontal scrollbar during animation

Browse Source 
Before this commit, when animated elements with a css translate
overflowed the #wrapwrap (before and during animations), a horizontal
scrollbar was visible on the #wrapwrap until the end of the animation.

After this commit, the horizontal scrollbar is no longer visible at
any time during the animations.

task-2215118

closes odoo/design-themes#470

X-original-commit: 22e83be4f3
Signed-off-by: Quentin Smetz (qsm) <qsm@odoo.com>
This commit is contained in:
Benjamin Vray
2021-07-27 14:20:10 +00:00
committed by qsm-odoo
parent 3425f69b7e
commit e1d105abaa
3 changed files with 38 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files
website_animate/static/src/js/o_animate.editor.js
+7
View File
@@ -5,12 +5,19 @@ var sOptions = require('web_editor.snippets.options');
function forceAnimation() {
var $els = $();
const $scrollingElement = $().getScrollingElement();
_.each(arguments, function (el) {
$els = $els.add(el);
});
$els.css('animation-name', 'dummy');
void $els[0].offsetWidth;
$els.addClass('o_animating');
$scrollingElement[0].classList.add('o_wanim_overflow_x_hidden');
$els.css('animation-name', '');
$els.one('webkitAnimationEnd oanimationend msAnimationEnd animationend', function (e) {
$scrollingElement[0].classList.remove('o_wanim_overflow_x_hidden');
$els.removeClass('o_animating');
});
}
// Animations