jQuery Slide CSS 元素移出减少不透明度

Question

您好，我正在尝试滑出一个 CSS 元素，逐渐消除不透明度，直到它完全消失。

例如，我想将文本向右滑动，从而在滑动时降低不透明度，直到完全消失。

//JQuery
$(document).ready(function() {
    $('.heading1').animate({marginRight:"20px",opacity:0},500)
})
//HTML
<div class="sliderContainer">

<a class="heading1">Text</a>

</div>

//CSS
.heading1 {
    position:relative;  
}

我已经试过了，但它并没有真正滑出，就像在屏幕上移动一样。它只是淡出。有什么想法吗？

我希望能够在屏幕内外设置动画以降低不透明度。

Answer 1

使用整数(20)代替字符串(20px):

$(document).ready(function() {
      $('.heading1').animate({'margin-right':20,opacity:0},500);
})