javascript - jQuery 基于滚动的淡入和淡出

标签 javascript jquery

我使用以下方法根据元素滚动的像素数将元素的不透明度从 0 更改为 1,效果非常好。

$(window).scroll(function() {
  if ($(this).scrollTop() > 200) {
      $("#hook").stop().animate({
          opacity: 1
      }, 300);
  } else {
      $("#hook").stop().animate({
          opacity: 0
      }, 300);
  }
});

我想补充的是,“当用户滚动 500 像素或更多时,将其淡出。”

最佳答案

我错过了什么吗?该代码 99% 都在那里! http://jsfiddle.net/AwnWe/2

$(window).scroll(function() {
  var scrollTop = $(this).scrollTop();
  console.log('Scroll ', scrollTop);
  if (scrollTop > 500 || scrollTop < 200) {
      $("#hook").stop().animate({
          opacity: 0
      }, 300);
  } else {
      $("#hook").stop().animate({
          opacity: 1
      }, 300);
  }
});​

关于javascript - jQuery 基于滚动的淡入和淡出,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/10743837/

相关文章:

javascript - 在 Android 7 上使用 cordova-plugin-file 不起作用

javascript - 将字符串转换为 html 元素以运行 javascript

jquery - 根据屏幕大小移动div

javascript - IE8 及以下 &lt;input type ="image"> value work around

javascript - 如何使用 JavaScript 计算一行中的字符数

java - 如何使用 eToken 在客户端加密数据

javascript - 在 Vuex 模块中进行继承的方法

javascript - 使用点击功能 jQuery 附加 HTML 不起作用

javascript - 如何在不嵌套的情况下对异步函数组进行排序(jquery $.when .then)

jquery - 获取 div 容器高度以动态调整大小以适应页脚