如何显示在浏览器滚动的div

我的页面布局有几个组的div重复像如何显示在浏览器滚动的div

<div--1> 

    <div--2> 

    <div--3> 

     <div--4>

t这结构重复了几次。我想隐藏div-4的内容以隐藏，直到用户滚动到该元素。我们如何实现这一功能？

我发现有这样的（http://www.appelsiini.net/projects/lazyload）图像

来源

2010-09-08 edava

此代码将显示和隐藏基于鼠标位置的div工作的插件。不知道如何检测特定的div是否在屏幕上。

<html> 
<head> 
<title>Show/Hide Divs</title> 
<script type="text/javascript"> 
function showMyContents(control) 
{ 
control.children["myContents"].style.display = 'inline'; 
} 

function hideMyContents(control) 
{ 
control.children["myContents"].style.display = 'none'; 
} 
</script> 
</head> 
<body> 

<div onmouseover="showMyContents(this);" onmouseout="hideMyContents(this);">show 1 
<div style="display:none" id="myContents">My Contents1</div> 
</div> 
<div onmouseover="showMyContents(this);" onmouseout="hideMyContents(this);">show 2 
<div style="display:none" id="myContents">My Contents2</div> 
</div> 
<div onmouseover="showMyContents(this);" onmouseout="hideMyContents(this);">show 3 
<div style="display:none" id="myContents">My Contents3</div> 
</div> 

</body> 
</html>

来源

2010-09-08 19:29:33

感谢克里斯的代码！任何人都可以通过浏览器滚动来帮助我展示div。当页面只加载页面可见部分的div（div4）时，初始化显示。以便页面加载更快 – edava 2010-09-13 19:34:28

如何显示在浏览器滚动的div

回答

相关问题