javascript - 调用 SlideOut 后的 Extjs stange 效果

Question

当我调用 slideOUT 时，div 高度减少到零并且所有组件都向上滚动！如何保存 Div 高度。目标是滑出一张图片，然后滑入另一张图片。但简而言之，我在 slideIn 和 slideOut 之间产生了一种奇怪的效果。因为 div 高度减少到零

 Ext.get("MENUNAV_nouvelle_commande").slideOut('r', {
     easing: 'easeOut',
     duration: 1000,
     remove: false,
     useDisplay: false
 });

Ext.get("MENUNAV_nouvelle_commande").slideIn('l', {
     easing: 'easeIn',
     duration: 1000
 });

Answer 1

我不是 100% 确定你看到了什么效果，但我假设你的意思是当你使用 slideIn() 和 slideOut() 时，所有其他 HTML 元素都被移动/重新定位以为新元素腾出空间. 这是有道理的，一个简单的解决方法是将滑动元素的样式设置为 position:absolute。

如果要使元素保持其相对于屏幕上其他元素的位置，可以将其放置在相对定位的父元素中。

<div style="position:absolute;" id="MENUNAV_nouvelle_commande"></div>

<script>
Ext.core.DomHelper.applyStyles(Ext.get("#MENUNAV_nouvelle_commande"), {
    top:  (window.innerHeight / 2) + 'px',
    left: '0'
});

Ext.get('#MENUNAV_nouvelle_commande).slideIn('t', { options });
</script>

希望有帮助。