jquery - スクロール中の不透明度の変更が機能していない

Question

スクロール中に不透明度を使用してdivをフェードインおよびフェードアウトさせようとしています。これはjsコードです

$(document).ready(function(){
        window.onscroll = scrolls;
    });
    function scrolls(){
        var offset = $("#scrollMore").offset();
        var w = $(window);
        var welcome = offset.top-w.scrollTop();
        console.log(welcome);
        if(welcome<100) {
            $("#scrollMore").fadeTo("slow",1);
        }
        else if(welcome>=100){
            $("#scrollMore").fadeTo("slow",0.1);
        }
    }

CSS

#scrollMore {
        background: url("http://www.wiltshirefarmfoods.com/images/scrollMore.png") no-repeat scroll center bottom transparent;
        cursor: pointer;
        height: 42px;
        right: 36px;
        text-indent: -9999px;
        width: 124px;
        z-index: 100;
        float: left;
        opacity: 0.1;
    }

しかし、それは機能していません。フェードインとフェードアウトに非常に長い時間がかかります。これは jsfiddle http://jsfiddle.net/jery0cdp/3/です。Bojan Petkovski のコードを使用した後の更新 [彼のおかげで]最初の回答から、クロムで動作しましたが、 Firefox http://jsfiddle.net/jery0cdp/5/でも同じ問題に直面しています。