jQuery scrollTop not working in Chrome but working in Firefox

后端 未结 15 1821
再見小時候
再見小時候 2020-11-29 02:54

I have used a scrollTop function in jQuery for navigating to top, but strangely \'the smooth animated scroll\' stopped working in Safari and Chrome (scrolling w

15条回答
  •  误落风尘
    2020-11-29 03:52

    So I was having this problem too and I have written this function:

    /***Working function for ajax loading Start*****************/
    function fuweco_loadMoreContent(elmId/*element ID without #*/,ajaxLink/*php file path*/,postParameterObject/*post parameters list as JS object with properties (new Object())*/,tillElementEnd/*point of scroll when must be started loading from AJAX*/){
    	var	
    		contener = $("#"+elmId),
    		contenerJS = document.getElementById(elmId);
    	if(contener.length !== 0){
    		var	
    			elmFullHeight = 
    				contener.height()+
    				parseInt(contener.css("padding-top").slice(0,-2))+
    				parseInt(contener.css("padding-bottom").slice(0,-2)),
    			SC_scrollTop = contenerJS.scrollTop,
    			SC_max_scrollHeight = contenerJS.scrollHeight-elmFullHeight;
    		if(SC_scrollTop >= SC_max_scrollHeight - tillElementEnd){
    			$("#"+elmId).unbind("scroll");
    			$.post(ajaxLink,postParameterObject)
    			 .done(function(data){
    			 	if(data.length != 0){
    					$("#"+elmId).append(data);
    					$("#"+elmId).scroll(function (){
    						fuweco_reloaderMore(elmId,ajaxLink,postParameterObject);
    					});
    				}
    			 });
    		}
    	}
    }
    /***Working function for ajax loading End*******************/
    /***Sample function Start***********************************/
    function reloaderMore(elementId) {
    	var
    		contener = $("#"+elementId),
    		contenerJS = document.getElementById(elementId)
    	;
    
        if(contener.length !== 0){
        	var
    			elmFullHeight = contener.height()+(parseInt(contener.css("padding-top").slice(0,-2))+parseInt(contener.css("padding-bottom").slice(0,-2))),
    			SC_scrollTop = contenerJS.scrollTop,
    			SC_max_scrollHeight = contenerJS.scrollHeight-elmFullHeight
    		;
    		if(SC_scrollTop >= SC_max_scrollHeight - 200){
    			$("#"+elementId).unbind("scroll");
    			$("#"+elementId).append('

    Was loaded

    Some text for content. Some text for content. Some text for content. Some text for content. Some text for content. Some text for content. Some text for content. Some text for content. Some text for content. Some text for content. Some text for content. Some text for content.

    '); $("#"+elementId).delay(300).scroll(function (){reloaderMore(elementId);}); } } } /***Sample function End*************************************/ /***Sample function Use Start*******************************/ $(document).ready(function(){ $("#t1").scrollTop(0).scroll(function (){ reloaderMore("t1"); }); }); /***Sample function Use End*********************************/
    .reloader {
        border: solid 1px red;
        overflow: auto;
        overflow-x: hidden;
        min-height: 400px;
        max-height: 400px;
        min-width: 400px;
        max-width: 400px;
        height: 400px;
        width: 400px;
    }
    
    	

    Some text for header.

    Some text for content.
    Some text for content.
    Some text for content.
    Some text for content.
    Some text for content.
    Some text for content.
    Some text for content.
    Some text for content.
    Some text for content.
    Some text for content.
    Some text for content.
    Some text for content.

    Some text for header.

    Some text for content.
    Some text for content.
    Some text for content.
    Some text for content.
    Some text for content.
    Some text for content.
    Some text for content.
    Some text for content.
    Some text for content.
    Some text for content.
    Some text for content.
    Some text for content.

    Some text for header.

    Some text for content.
    Some text for content.
    Some text for content.
    Some text for content.
    Some text for content.
    Some text for content.
    Some text for content.
    Some text for content.
    Some text for content.
    Some text for content.
    Some text for content.
    Some text for content.

    I hope it will be helpfully for other programmers.

提交回复
热议问题