Jquery 在窗口中显示另一个div时隐藏元素

当窗口中显示

#pre footer

或

#footer

div时，我需要将类

.hidden

切换到我的粘性菜单

我一直在处理jquery和

scrollTop（）但似乎无法启动它。任何帮助都将不胜感激

$(document).ready(function() {
    var $window = $(window);
  var tabwrap = $('.tab-wrap');
  var prefooter = $('#pre-footer');
  $window.on('scroll', function() {
    var scrollTop = $window.scrollTop();
    tabwrap.toggleClass('hidden', scrollTop > 300); /* Help! */
    /* .tabwrap should toggle class .hidden when #pre-footer and or #footer is visible in window */
  });
});

到目前为止，摆弄：
因此，基本上您希望在视口底部与
的底部对齐时切换类。因此，当视口的
scrollTop
值+高度大于
pre-footer
+pre-footer
的顶部位置时

$(document).ready(function() {
  var $window = $(window);
  var tabwrap = $('.tab-wrap');
  var prefooter = $('#pre-footer');
  var prefooter_top = prefooter.offset().top;
  var prefooter_height = prefooter.height();
  var prefooter_bottom = prefooter_top + prefooter_height;
  console.log(prefooter_bottom);
  $window.on('scroll', function() {
    var scrollTop = $window.scrollTop();
    var viewport_height = $(window).height();
    var scrollTop_bottom = scrollTop + viewport_height;
    tabwrap.toggleClass('hidden', scrollTop_bottom > prefooter_bottom); 
  });
});

var tabwrap=$（'.tab wrap'）；
var prefooter=$（“#pre-footer”）；
/**
*@desc检查元素是否在视口中
*/
$.fn.isInViewport=函数（）{
变量元素=$（此），
elementHt=element.outerHeight（），
elementTop=element.offset（）.top，
elementBot=elementTop+elementHt，
viewportTop=$（窗口）.scrollTop（），
viewportBot=viewportTop+$（窗口）.outerHeight（），
偏移量=0.35*elementHt；//顶部和底部的百分比
return（elementBot-offset）>viewportTop&（elementTop+offset）
您就快到了。您应该在if语句中使用addClass（），然后在else语句中使用removeClass（）。@mdurchholz我刚才又检查了一遍。。。我想我走远了！此代码与初始代码完全相同。干杯，先生们！但是有没有办法查询视口中是否显示
#pre-footer
或
#footer
？与仅仅从顶部说300px相反？@GavinFriel当然有！获取jQuery偏移量或顶部#pre footer的位置值。将其添加到元素的高度，并使用结果与scrollTop进行比较。我会更新我的答案。你是一个向导@DerekNolan。干杯，伙计！
var tabwrap   = $('.tab-wrap');
var prefooter = $('#pre-footer');

/**
 * @desc Check to see if element is inside the viewport
 */
$.fn.isInViewport = function() {
    var element     = $(this),
        elementHt   = element.outerHeight(),
        elementTop  = element.offset().top,
        elementBot  = elementTop + elementHt,

        viewportTop = $(window).scrollTop(),
        viewportBot = viewportTop + $(window).outerHeight(),

        offset      = 0.35 * elementHt; // pecentage of top and bottom

    return (elementBot - offset) > viewportTop && (elementTop + offset) < viewportBot;
};


function checkOffset()
{
    if( prefooter.isInViewport() )
        tabwrap.addClass('hidden');
    else
        tabwrap.removeClass('hidden');
}

$(window)
.load(function(){ checkOffset(); })
.scroll(function(){ checkOffset(); });