Question

我在另一篇文章中发现了这个并且它工作得很好，除了我需要反转它以便当我滚动＆＃34; down＆＃34;它在div中淡出。

var target = $('#bluOverlay');
var targetHeight = target.outerHeight();

$(document).scroll(function(e){
    var scrollPercent = (targetHeight - window.scrollY) / targetHeight;
    if(scrollPercent >= 0){
        target.css('opacity', scrollPercent);
    }
});

以下是其他帖子http://jsfiddle.net/meEf4/

的工作小提琴

Answer 1

您最初可以将opacity的{{1}}设置为零，然后向下滚动时逐渐增加不透明度。

Demo

＆＃13;

div

＆＃13;

var target = $('div'),
  targetHeight = target.outerHeight();

$(document).scroll(function(e) {
  var scrollPercent = (targetHeight - window.scrollY) / targetHeight;

  if (scrollPercent >= 0) {
    target.css('opacity', 1 - scrollPercent);
  }
});

＆＃13;

body {
  height: 3000px
}
div {
  height: 1000px;
  background: red;
  opacity: 0;
}

＆＃13;

当我向下滚动时，Jquery淡入div

1 个答案: