Deepa
Deepa

Reputation: 41

Jquery Scrolltop() on body element is returning 0 everytime in Chrome

I am using jQuery scrollTop() on body element to diplay a menu bar at top of the page after the body has scrolled a particular height. This is working in FF but in chrome scrollTop always returns zero.

Here is my jquery:

var j = jQuery.noConflict(); //Use j instead of $ for firing jQuery library's.
function goToScrollTop() {
    j("body").scrollTop(0);
}

( function(j) {

    j(document).ready(function(){

        var scrollHeight = j("body").scrollTop();
        j("#resultPageMenuBar").hide(); //Hide the result page menu bar

        j("body").scroll(function(){ //on scroll of the result page 

       scrollHeight = j("body").scrollTop();
     //scrollHeight is 0 always in chrome
        if( scrollHeight > 160){...

CSS:
    .resultPageMenuBarInnerDiv {    
    width: 100%;
    display:none;
    top: 0px;   
    left: 0px;
    position:fixed; 
    z-index:6;  
    }   

JSP:
    <div id="resultPageMenuBar" class="resultPageMenuBarInnerDiv" >

Please help as the available solutions did not work. Thanks!

Upvotes: 1

Views: 635

Answers (1)

DGS
DGS

Reputation: 6025

Use document instead of body

Like j(document).scrollTop()

https://jsfiddle.net/uv1d4o7f/

Upvotes: 0

Related Questions