jQuery, scroll, fadein scroll elements when they are at 150px the bottom of the window (viewport)

Question

I know there are plugins for this but I wouldn’t want to use it unless I really had to, in this case I don’t think I need to. I would like a series of divs faded (one at a time) when your 'top' was at 150px (e.g.) the bottom of the window and fadeOut when at less than 150px. My code:

I tried to thus but it doesn’t work well, I based myself in this

HTML:

...

<div id="projectImgs"><?php
    foreach ($imgsFromProject as $extraImg) { ?>
       <div class="wrapperExtraImg" data-image="<?php echo 'admin/' .$extraImg->image_path; ?>" style="background-image:url(<?php echo 'admin/' .$extraImg->image_path; ?>)"></div>
    <?php } ?>
</div>

...

CSS:

...

#projectImgs {
    font-size: 0;
    margin: 30px auto;
    width: 100%;
    max-width: 900px;
}
.wrapperExtraImg {
    text-align: center;
    cursor: pointer;
    position: relative;
    width: 435px;
    display: inline-block;
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
    height: 435px;
}

...