在特定点后显示固定div（响应）

Question

我有一个带固定按钮的div。我还有一个页面上有一个表单，我想隐藏固定的div，直到我到达我的表单的发送按钮（底部）。

我一直在尝试这个（可能有点蹩脚）：

$(document).ready(function() {
  $("#MyFixedDiv").hide(); //hide your div initially
  var topOfOthDiv = $("#MyForm").offset().top;
  $(window).scroll(function() {
    if($(window).scrollTop() > topOfOthDiv) { //scrolled past the other div?
        $("#MyFixedDiv").show(200); //reached the desired point -- show div
    } else {
        $("#MyFixedDiv").hide(200); //reached the desired point -- hide div
    }
  });
});

问题是.offset（）。top在发送按钮后没有显示我的固定div。对于窗口调整大小不是最佳解决方案。

到目前为止，最好的方法是使用z-index，但我认为可能会有更优雅的解决方案。

有没有办法显示我的固定div总是当用户到达我的表单的绝对底部发送按钮，即使屏幕是320px宽度或1280px宽度？就像-tags的锚点一样。

编辑：这是一个例子：

在屏幕顶部和表格底部之间，无论高度如何，它都必须是隐形的，然后在我的表格下方，它必须出现并一直固定在底部。

Answer 1

在this fiddle中，我展示了一个有效的例子。

理想情况下，最好尽可能使用CSS执行此类操作。元素被固定并隐藏起来，然后在到达某个滚动点时添加使其可见的类。如果再次滚动太高（然后依此类推），则会删除此类。

我不是100％肯定是什么导致你的错误没有显示。它可能是最初的$("#MyFixedDiv").hide();。一旦我开始使用CSS显示/隐藏，我再也没有遇到过它。