好的,所以我的问题是我有一个客户的视差网站,当他们向下滚动视差网站时,他们希望产品描述淡入。我认为我遇到的问题是因为该站点实际上是一个长页面,当页面加载时脚本变得混乱并且从“opacity:0”淡入div。我已经在 div 上进行了长时间的淡入以了解正在发生的事情,并且我还制作了一个没有适当格式的垃圾箱来测试它。我已经上传了该站点的临时副本(我正在离线工作)以显示正在发生的事情。
http://ethicalincubator.com/parallax/parallax30.07/index_kmd.php#!images
谢谢大家的帮助!!!:-)
CSS
/* Hide any element */
.hideme {
Opacity:0;
}
HTML
<div
class="hideme fadein-on-view"
style="opacity:0;width:200px;height:80px;background-color:white;">Fade
In</div>
脚本
<script>
// Scroller script for Fade-In when "div" is on screen
$(document).ready(function()
{
/* Every time the window is scrolled ... */
$(window).scroll( function(){
/* Check the location of each desired element */
$('.fadein-on-view').each( function(i){
var
bottom_of_object = $(this).position().top + $(this).outerHeight();
var
bottom_of_window = $(window).scrollTop() + $(window).height();
/* If the object is completely visible in the window, fade it it */
if(
bottom_of_window > bottom_of_object ){
$(this).animate({'opacity':'1'},5000);
}
});
});
})
</script>