如果其他div被卷出，如何淡入div

只是摆弄一个页面的布局。该页面的第一部分显示一个div内的图像。如果徽标滚动出可见区域，则导航栏中应显示带有较小徽标图像的另一个div。当然，如果大标识再次滚动，小徽标应该会消失。

如何在js中做到这一点？

2014-09-29 Frank

到目前为止的任何尝试？ – doniyor 2014-09-29 21:55:41

JavaScript不是我的东西。我尝试了一下，但让我的整个js卡住了。我问谷歌没有有用的结果（因为没有正确的搜索条件）。 – Frank 2014-09-29 22:01:49

可能是这样的？

$(window).scroll(function() { 
     if ($('#element').visible(true)) { 
      // show big logo 
     } else { 
      // show small logo 
     } 
    });

来源

2014-09-29 22:09:08

不错，但我宁愿寻找这样的东西（但在js不在vb ;-)）： if divWithBigImage.visible = false then divWithSmallImage.visible = true – Frank 2014-09-29 22:20:31

检查我的编辑。像那样的东西？ – 2014-09-29 22:33:13

的JavaScript：

// Document ready 
jQuery(document).ready(function(){ 

    // When window is resized 
    jQuery(window).bind("resize", function(){ 

     // If big logo does not fit in container 
     if (jQuery("#big").width() >= jQuery("#container").width()) { 

      // Big out, small in 
      jQuery("#big").fadeOut(function(){ 
       jQuery("#small").fadeIn(); 
      }); 

     // If big logo fits in container 
     } else { 

      // Small out, big in 
      jQuery("#small").fadeOut(function(){ 
       jQuery("#big").fadeIn(); 
      }); 

     } 

    }); 

});

HTML：

<div id="container"> 
    <img id="big" src="big.png" alt="big" /> 
    <img id="small" src="small.png" alt="small" style="display: none;" /> 
</div>

来源

2014-09-29 22:11:03

不会，这会导致只有一个标识是根据浏览器窗口大小选择的，因为该页面已被加载。这真的很难为我解释... 这里[链接]（http://stackoverflow.com/questions/13942811/fade-out-in-sperate-divs-with-button-click）是一个答案如何淡入/淡出点击按钮上的div。我的触发器应该是一个元素的消失，而不是点击按钮。 – Frank 2014-09-29 22:38:01

@Frank如果我了解你，这个新的代码应该可以工作。 – 2014-09-30 14:52:21

你有没有在jQuery的航点看呢？ http://imakewebthings.com/jquery-waypoints/

我认为您正在尝试做类似于粘性菜单示例http://imakewebthings.com/jquery-waypoints/shortcuts/sticky-elements/应该很容易更改以满足您的需求。

来源

2014-09-29 22:41:55 Amir5000

如果其他div被卷出，如何淡入div

回答

相关问题