<p>我的问题非常简单。我有一个从右到左滑动打开的弹出窗口，希望它能从左到右滑动关闭。目前我能够正确地打开弹出窗口，但无法按照我期望的方式关闭它。</p>
<pre class="brush:php;toolbar:false;"><div class="overlay">
<div class="items-content">
<h1> hello </h1>
</div>
</div>
.overlay {
opacity: 0;
transition: opacity 0.4s linear;
}
.overlay {
&.-show {
opacity: 1
}
}
.overlay {
.items-content {
transform: translateX(200%);
transition: transform 0.4s ease-in-out;
}
}
.overlay {
&.-show {
.items-content {
transform: translateX(0);
transition: transform 0.4s ease-in-out;
}
}
}</pre>
<p>我尝试设置透明度、添加过渡效果、过渡延迟，但似乎没有什么作用。</p>
1
1007
收藏
你需要重置位置，请尝试以下代码：
.overlay { &.-show { .items-content { transform: translateX(0); // 这里应该是0 transition: transform 0.4s ease-in-out; } }}