Question

我正在尝试使我的div的不透明度逐渐增加，就像移动滚动一样，

$(document).ready(function() {
    $(document).scroll(function(e) {
        opacidade();
    });

    var element = $('#element');
    var elementHeight = element.outerHeight();

    function opacidade() {
        var opacityPercent = window.scrollY / 100;
        if (scrollPercent <= 1) {
            element.css('opacity', opacityPercent);
        }
    }
});

正在工作，但不透明度正在快速上升我发现示例降低不透明度，但如果在我的规则css我的div被声明为不透明度0任何knwo应该是

Answer 1

改变的： jsFiddle

$(document).ready(function() {
    $(document).scroll(function(e){
        opacidade();
    });

    var element = $('#element');
    var elementHeight = element.outerHeight();

    function opacidade(){
        var opacityPercent = window.scrollY   / $(document).height();
        console.log(window.scrollY, opacityPercent);
            element.css('opacity', opacityPercent);
    }
});

scrollY是一个像素值，因此除非您限制可能的滚动范围[0 - 100]，否则没有理由将它除以100.
所以你需要的是将滚动除以总文档的高度（或包含它的任何父级并显示滚动条）

使用jquery滚动时的不透明度

1 个答案: