视差滚动不透明度问题

Question

我正在对页面进行编码，以便在滚动时内容淡入淡出。

当你滚动离开＆＃34;三部曲＆＃34;部分，然后向上滚动，再次在顶部时不是100％不透明度。

同样内容在三部曲部分的一半淡出，然后再次淡入。当在视图中时，我需要在顶部（减去绿色标题区域）时的内容为100％不透明度。

代码：

$(document).ready(function() {

$(window).bind('scroll', function(e) {
    setParalaxContent();
});

function setParalaxContent() {

 var trilogy = {
    scrollTop: $(window).scrollTop(),
    windowHeight: $(window).height(),
    contentTop: $('.trilogy2').position().top,
    contentHeight:2200  
};

// determine scrollTop's bounds where content enters & exits the window
trilogy.lowerBound = trilogy.contentTop - trilogy.windowHeight;
trilogy.upperBound = trilogy.contentTop + trilogy.contentHeight;
// determine scrollTop's position percentage (x2) in relation to bounds
trilogy.percent = (trilogy.scrollTop - trilogy.lowerBound) /     (trilogy.upperBound - trilogy.lowerBound) * 2;

}

$('.trilogy2').animate({
    opacity: 1 - Math.abs(trilogy.percent - 1)
}, 1);

请参阅以下全部代码： http://jsfiddle.net/warrior_76/pnr4fdyg/