jQuery插件 -- 图片随页面滚动fixed

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
</head>
<body style="margin:0;padding:0;height:2000px;">
    <div style="height: 500px;background: #ccc;">this is div</div>
    <img src="baloons.jpg" width="500">
</body>
<script src="jquery-1.12.4.min.js"></script>
<script>
    $.fn.extend({
        fixedPos : function(param){
            var $offTop = Number(param)>=0 ? param : 0;
            this.each(function(){
                var $obj = $(this);
                var offTop = $obj.offset().top - $offTop;
                var offLeft = $obj.offset().left;
                $(window).on("scroll",function(){
                    var scrollTop = $(window).scrollTop();
                    if(scrollTop >= offTop){
                        $obj.css({'position':'fixed','left':offLeft,'top':$offTop});
                    }else{
                        $obj.css('position','static');
                    }
                })
            })
        }
    })
    $("img").fixedPos(40);
</script>
</html>