當用戶滾動時出現圖像

我有一個非常長的html頁面，有很多東西。我希望在用戶向下滾動頁面併到達div時出現div中的圖像。當用戶滾動時出現圖像

該公寓將通過CSS屬性過渡進行管理：不透明度但我不明白如何觸發效果。

2013-11-14 user2991804

嘗試：http://johnpolacek.github.io/scrollorama/ – myajouri

搜索「延遲加載」。 –

爲例

CSS

.imageToAppear{display:none;opacity:0}

HTML

<div id="wantedonscroll"></div> 
<div id="imageToAppear"><img src="/01.png"></div>

JQUERY

$("#wantedonscroll").scroll(function() { 
$("#imageToAppear").fadeIn(); 
});

可以costumize淡入事件這裏是文檔Jquery Fadein

來源

2013-11-14 11:52:12 K3rnel31

感謝您的回答:)

，但它只是沒有在我的html頁面工作...

這是我的文件：

<!DOCTYPE html> 
<html> 
<head> 
<meta charset="utf-8" /> 
<title>test</title> 
<style type="text/css"> 
#imageToAppear{display:none;opacity:0} 
</style> 
</head> 

<body> 
<div> 
<p>Lorem ispum .... and a lot of things in order to have something to scroll</p> 
</div> 
<div id="wantedonscroll"></div> 
<div id="imageToAppear"><img src="test.png"></div> 

<script type="text/javascript" src="jquery.js"></script> 
<script type="text/javascript"> 
$("#wantedonscroll").scroll(function() { 
$("#imageToAppear").fadeIn(); 
}); 
</script> 
</body> 
</html>

什麼是錯的？

來源

2013-11-15 08:59:46 user2991804

當用戶滾動時出現圖像

回答

相關問題