tutorials.de - scrollTop für DIV Element gibt immer 0 zurück - Demo #2

by SpiceLab

HTML

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<div>....</div>
<div class="container-fluid portfolio-me" id="xxx" style="border:1px solid green;">
         
            <ul class="ul-wrapper-portfolio">
         
                <li>
                    <img src="https://placeholdit.imgix.net/~text?txtsize=33&txt=450%C3%97350&w=450&h=300" class="img-thumbnail">
                </li>
                <li>
                    <img src="https://placeholdit.imgix.net/~text?txtsize=33&txt=450%C3%97350&w=450&h=300" class="img-thumbnail">
                </li>
                <li class="li-clear-portfolio">
                    <img src="https://placeholdit.imgix.net/~text?txtsize=33&txt=450%C3%97350&w=450&h=350" class="img-thumbnail">
                </li>
                <li>
                    <img src="https://placeholdit.imgix.net/~text?txtsize=33&txt=450%C3%97350&w=450&h=350" class="img-thumbnail">
                </li>
             
            </ul>
         
        </div>
<div>...</div>

CSS

.about-me, .portfolio-me, .contact-me {
    width:70%; margin:0 auto; padding:0 0 40px 0; background-color:#DBE0FD; display:block;
}

JavaScript

$(window).scroll(function() {
  var $portfolio = $("#xxx");
  var window_offset = $portfolio.offset().top - $(window).scrollTop();
  console.log('PORTFOLIO: ' + window_offset)
});