3

I've made a small jQuery code, which works on Chrome and Opera, but not on IE and Firefox.

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.3/jquery.min.js">
$(document).scroll(function () {
    if ($('body')[0].scrollTop / $('body')[0].scrollHeight > 0.29) {
     $(".over_one").fadeIn(2000);
    } else {
     $(".over_one").fadeOut(1);
    }
   });
</script>

I have also searched here and here, but this was not fixing my problem.
Community
  • 1
  • 1
mishad050
  • 448
  • 5
  • 15
  • Have you tried the equivalent jQuery methods for accessing those properties? `scrollHeight` is not supported on all browsers. – iCollect.it Ltd Apr 29 '15 at 09:34
  • 1
    Browsers use different elements for scrolling. Some use `html`, others `body`. You code looks like it could suffer from it, apart from what @Filype found. (Although "does not work" is kind of a vague error description, given that we don't know what you want to achieve.) – Boldewyn Apr 29 '15 at 09:39
  • I fixed it guys, i've add the `'html, body'` to `.scrollHeight` and deleted the `.scrollTop`, thanks for your help @Boldewyn, @TrueBlueAussie and @Filype – mishad050 Apr 29 '15 at 10:19

1 Answers1

1

I think you have a src attribute and javascript code inside the script tag. This should be separated into 2 script tags.

Generally what you posted is written as: (though that may not be the problem)

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.3/jquery.min.js"></script>

<script>
$(document).ready(function () {
  if ($('body')[0].scrollTop / $('body')[0].scrollHeight > 0.29) {
    $(".over_one").fadeIn(2000);
  } else {
    $(".over_one").fadeOut(1);
  }
});
</script>
filype
  • 8,034
  • 10
  • 40
  • 66