jquery - 使用 jquery 检查 css 底部

Question

我正在尝试使用报价进行某种提要，并且如果报价低于屏幕上的特定水平，我想重置报价。

function MoveDown(speed) {

            $('#QuoteOne').animate({
                  bottom: '-=100'
                }, speed);

            $('#QuoteTwo').animate({
                  bottom: '-=100'
                }, speed);

            $('#QuoteThree').animate({
                  bottom: '-=100'
                }, speed);

            $('#QuoteFour').animate({
                  bottom: '-=100'
                }, speed);

            console.log($('#QuoteOne').css("bottom"));  

            if($('#QuoteOne').css("bottom") == '-400px' )
            {   
                $('#QuoteOne').animate({
                  bottom: '= 0'
                }, speed);
            }
        }

控制台日志显示-400px，但我无法让它移回顶部。我缺少什么？

Answer 1

首先，该代码将在动画完成之前执行。如果您希望该代码在动画之后执行，请将其添加为 #QuoteOne 元素的 animate 函数的回调:

$('#QuoteOne').animate({
  bottom: '-=100'
}, speed, function() {
  if ( $(this).css("bottom") == "-400px" )
    ...
});

然后将 bottom: '= 0' 更改为 bottom: 0。

$('#QuoteOne').animate({
  bottom: 0
}, speed);