Scroll Function working in reverse order

Question

I am calling a function when user scroll to the bottom.

In my case function is called when scroll reaches top instead of bottom. Working in reverse order.

Make a file with name " scroll.html " and copy my code below and past it in that file. You will find the bug

Please help fixing this issue in file instead of fiddle.

Because my code works perfect in fiddle. I want to know what is the problem with my document ?

Code :

<html>
<head>
<script src="http://code.jquery.com/jquery-2.0.2.js"></script>

</head>

<body>
<script>
$(document).ready(function () {
    $(window).scroll(function () {
        if ($(document).height() == $(window).scrollTop() + $(window).height()) {
            alert('You\'ve reached the bottom');
        }
    });
});
</script>

<br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/>
<br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/>

</body>
</html>

Please do make an HTML file of it. And then test it.

Please post a fiddle and code example in your post. Providing a link to a website which might not be there in a few minutes, hours, days is useless for future visitors. So please post your code, and a link to a demo that will exist for longer than a few days (for example on jsfiddle). — qwertynl, Dec 04 '13 at 13:59
Can you show the code that has the problem? Don't link to external files. Also, your link doesn't work. — putvande, Dec 04 '13 at 13:59
@CodeHunter Please post a fiddle and code example in your post. Providing a link to a website which might not be there in a few minutes, hours, days is useless for future visitors. So please post your code, and a link to a demo that will exist for longer than a few days (for example on jsfiddle). — qwertynl, Dec 04 '13 at 14:02
Post the code or make a [FIDDLE](http://jsfiddle.net "JSFiddle"). — Milan and Friends, Dec 04 '13 at 14:02
In fiddle it works fine. as I mentioned in my post. But it doesnt works in my file. Please download this file — Hassan Sardar, Dec 04 '13 at 14:03
Please do make an HTML file of it. And then test it. It will not work in html file — Hassan Sardar, Dec 04 '13 at 14:09
@CodeHunter Try debugging on your side, is $(window).height() the value you expect??? — A. Wolff, Dec 04 '13 at 14:12
I put your script just before the `
` tag in one of my templates and it works like it should but without `$(document).ready(function () {`. — Milan and Friends, Dec 04 '13 at 14:13
@A.Wolff Basically the is issue is something else, this code works fine on fiddle, but not on simple html document. Please copy my code and past it in an html file. than check, it will work in reverse order — Hassan Sardar, Dec 04 '13 at 14:14
It's your code just without `$(document).ready(function () { });`. — Milan and Friends, Dec 04 '13 at 14:16
@CodeHunter no, this is your issue on your site!!! $(window).height() is not the expected value. And no, i won't download any file to debug your awful code, i'm afraid — A. Wolff, Dec 04 '13 at 14:17
@A.Wolff There is no site at all, just an HTML file. Did you check it in html file ? Just copy my code — Hassan Sardar, Dec 04 '13 at 14:18
@CodeHunter i din't post your previous question where you posted your online site as duplicate, should I? — A. Wolff, Dec 04 '13 at 14:18
@A.Wolff Yes but now its not even working on simple plain and clean html file. — Hassan Sardar, Dec 04 '13 at 14:20
So provide a jsfiddle. I know you will tell it works on jsfiddle so maybe your issue is related to some CSS rule. And here we go, have you try setting body height: `body{height:100%}` Try and see — A. Wolff, Dec 04 '13 at 14:22
@A.Wolff My code works perfect in fiddle. But it doesnt works in simple html file. All you have to do is to make an html file with name : scroll.html and copy code from my post and past it in that html file. You will find the bug — Hassan Sardar, Dec 04 '13 at 14:24
I already do that and your code works just fine both in the Fiddle and in the one of my templates + on that template I have 1000+ lines of jQuery. — Milan and Friends, Dec 04 '13 at 14:26

score 1 · Accepted Answer · edited May 23 '17 at 12:28

1

Your window height is not returning expected value, because you are not setting any DOCTYPE:

<!DOCTYPE html>

SEE

edited May 23 '17 at 12:28

Community

1
1

answered Dec 04 '13 at 14:40

A. Wolff

74,033
9
94
155

Scroll Function working in reverse order

1 Answers1