Jquery移动底部导航栏

Question

我有一个问题，真的不知道如何解决这个问题。我有一个像这样的粘性页脚：

.ui-footer, .footer, .footer li, .footer a, .footer a:after {
    background-color: transparent !important;
    border-color: transparent !important;
    height: 70px;
}

因此我设置了这个样式：

{{1}}

但这很烦人，因为我的内容是在图标后面，并不是很好。它看起来像这样：

我已经改变了白色块的高度，但是这些块的高度并不高。这是因为通知块是动态的，内容因长度而异。因此，第二块具有可折叠的块，其中Boardingpass被写入。

如何看待：

这是一个重现问题的FIDDLE。我希望有人可以帮助我：）

Answer 1

你可以设置下边距：

#flight-info-block {
  margin-bottom: 80px !important;
}

同样在代码中，使用slideToggle函数的第三个参数在动画结束时实现相同的效果：

//open up the content needed - toggle the slide- if visible, slide up, if not slidedown.
$content.slideToggle("slow", "swing", function() {
    $("#flight-info-block").css("margin-bottom", "80px");
    $("#flight-info-block").trigger("updatelayout");
});

顺便说一句：我也不喜欢透明背景，然后我在你的CSS底部添加了以下规则：

.footer {
  background-color: #00a0e5 !important;
}

并删除了scrollTop中的-350偏移量：

$('html, body').animate({
    scrollTop: $header.offset().top
}, 1000);

您更新的小提琴：http://jsfiddle.net/yTt9b/1787/