Question

我有以下脚本效果很好：

$(that).parents(".portlet").fadeOut('slow', function() {
    $(that).parents(".portlet").remove();
});

它会淡化元素，然后将其从屏幕上完全删除。

我希望通过在淡出时向上滑动来略微改善效果。我该怎么做？

只是为了澄清，我不希望它淡出然后向上滑动，或向上滑动然后淡出，我希望它淡出，并且在它消失的同时，我想要它向上滑动。

Answer 1

$(that)
    .parents(".portlet")
    .animate({height: 0, opacity: 0}, 'slow', function() {
        $(this).remove();
    });

Answer 2

怎么样：

$('#clickme').click(function() {
  $('#book').animate({
    opacity: 0,
    height: '0'
  }, 5000, function() {
    // Animation complete.
  });
});

将转到opacque 0和height 0。

点击此处了解详情：http://api.jquery.com/animate/

Answer 3

使用jQuery .animate()，您可以同时操作多个属性 - 请参阅demo

Answer 4

为了避免跳跃效应，请不要忘记填充和放大效果。余量。 jQuery-Team不使用属性0.而是使用值'hide'＆amp; '节目'。 e.g。

    $('#elementId').animate({
            opacity: 'hide',      // animate slideUp
            margin: 'hide',
            padding: 'hide',
            height: 'hide'        // animate fadeOut
        }, 'slow', 'linear', function() {
            $(this).remove(); 
        });

Answer 5

你可以使用jquery的.animate函数

您可以根据需要设置任意数量的动画。

将不透明度作为参数＆amp;还可以将slideUp作为参数

api.jquery.com/animate /

Answer 6

您可以使用.animate()。

$(that).parents(".portlet").animate({
    opacity: 0,
    height: 0
}, 'slow', 'linear', function() {
    $(that).parents(".portlet").remove();
});

淡出并同时向上滑动？

6 个答案: