如何在滚动条上显示和隐藏div

时间:2018-09-20 19:29:54

标签: javascript

我当前有一个工作脚本,当滚动#idX时显示div,而在#idX上方滚动时隐藏div。但是,如果我向下滚动页面向下传递另一个元素,我还需要div隐藏。这是我的代码相互冲突的地方。你们有什么建议吗?

它应该像这样

< #idX hide
> #idX show
> #idX2 hide
< #idX2 show

到目前为止,这是我的代码,当我传递所选元素时显示div,在其上方隐藏时显示。当滚动向下沿页面传递另一个元素时,我无法隐藏它。 :/

var offsetTop = $(".elementor-element-27967803").offset().top;
$(window).scroll(function(){
  var scrollTop = $(window).scrollTop();
  if(scrollTop > offsetTop){
    $("#nav-menu-shortcut").fadeIn(500);
  }
	  if(scrollTop <offsetTop){
    $("#nav-menu-shortcut").fadeOut(500);
  }
});

1 个答案:

答案 0 :(得分:0)

虽然您需要根据两个分区的offsetTop显示菜单,所以不是通过一个div的offsetTop来为您的两个div都创建数组,而是根据您的结果情况创建合适的if语句以实现结果

var offsetTop = [$("#IDX").offset().top,$("#IDX2").offset().top];
$(window).scroll(function(){
  var scrollTop = $(window).scrollTop();
  if(scrollTop > offsetTop[0]){
    $("#nav-menu-shortcut").fadeIn(500);
  }
  if(scrollTop >offsetTop[1]){
$("#nav-menu-shortcut").fadeOut(500);
  }
})