我有 Jquery 代码在页面加载时淡化某些 div。当用户在我的网页上滚动 2000 像素时，我将如何编辑此代码以触发此操作。
JQUERY
$(function () { $(window).load(function() {
$('.welcome-image').addClass('animated fadeInRightBig');
})
var reset = function reset() {
console.log($(this).scrollTop());
// do stuff when window `.scrollTop()` > 75
if ($(this).scrollTop() > 2000) {
// turn off scroll event so `fx` not called
// during ongoing animation
$(this).off("scroll");
// when all animations complete
fx()
}
};
// if `fx` should only be called once ,
// change `.on()` to `.one()` ,
// remove `.then()` callback following `fx()`
// within `reset`
$(window).on("scroll", reset);
});
最佳答案
试试这个
<html>
<head></head>
<title></title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<style type="text/css">
body{
height: 1000px;
}
</style>
<body>
<h2>scroll the body to see the magic</h2>
</body>
<script type="text/javascript">
$(window).on("mousewheel", function() {
var the_position = $(document).scrollTop();
if (the_position > 200)
{
$('body').css({"background-color":"red"});
}
else
{
$('body').css({"background-color":"white"});
}
});
</script>
</html>根据需要更改功能和其他内容。这是一个让你和想法的例子。
关于javascript - 当用户滚动到网站部分时淡入 div，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/39191042/