JS Scroll problem

[Cc_Cc_Cc]

Hallo,

ich wollte es so machen , dass ich beim Runterscrollen, wenn es am Ende angekommen ist, er etwas ausgibt.

Der macht das aber nur wenn ich erst nach unten dann wieder nach oben scrolle. Ich wollte aber, dass er immer am ende etwas ausgibt. Woran liegt das?

Normal funktioniert es ja so:

$(window).scroll(function() {
    if($(window).scrollTop() == $(document).height() - $(window).height()) {
          ...
    }
});

Da ich aber eine Modal Box habe und die height auf 500px ist und overflow-y müsste ich es irgendwas anders machen oder warum funktioniert es nicht?

HTML:

 Spoiler

<section class="result_reactions_data_users">
    <div class="item">
        <p>Hier steht etwas drinne.</p>
    </div>
    ...
    ...
</section>

CSS:

 Spoiler

.result_reactions_data_users {
  display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-box-direction: normal;
    -moz-box-direction: normal;
    -webkit-box-orient: horizontal;
    -moz-box-orient: horizontal;
    -webkit-box-pack: center;
    -moz-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-align-content: stretch;
    -ms-flex-line-pack: stretch;
    align-content: stretch;
    -webkit-box-align: center;
    -moz-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin: 0 auto;
    text-align: center;
    overflow-y: scroll;
    height: 500px;
    padding: 8px;
}

JS:

 Spoiler

$('.result_reactions_data_users').scroll(function() {
        if($('.result_reactions_data_users').scrollTop() == $('.result_reactions_data_users').height() - $('.result_reactions_data_users').height()) {
    alert('ausgabe');
}
});

[False]

Habe dir mal ein Beispiel erstellt


Dein Code kann ich nicht ganz nachvollziehen da z.B.

$('.result_reactions_data_users').height() - $('.result_reactions_data_users').height()

logischerweiße 0 ergibt...

[Cc_Cc_Cc]

Originally Posted by .ƒaℓsє.

Habe dir mal ein Beispiel erstellt


Dein Code kann ich nicht ganz nachvollziehen da z.B.

$('.result_reactions_data_users').height() - $('.result_reactions_data_users').height()

logischerweiße 0 ergibt...

Danke dir hat geklappt

[Cc_Cc_Cc]

Originally Posted by False

Habe dir mal ein Beispiel erstellt


Dein Code kann ich nicht ganz nachvollziehen da z.B.

$('.result_reactions_data_users').height() - $('.result_reactions_data_users').height()

logischerweiße 0 ergibt...

Hab grad ein Problem gemerkt,

Wenn ich ein Container einfüge,

<div class="container">
  <div class="a">
    <div class="b">
       Hier steht etwas....
    </div>
  </div>
</div>

CSS:

.container {
  height:75%;
}

.a {
 height: calc(100%);
}

Dann funktoniert das nicht. Ich wollte es so machen das der Scroll-Content sich bei jeder Höhe anpasst deswegen 100%.