blocks|key|1008501|text|我不认为scrollTop是一个有效的属性。如果您想要滚动动画，可以尝试jquery的scrollTo插件|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1008502|http://plugins.jquery.com/project/ScrollTo|offset|length|1008503|entityMap|0|LINK|mutability|MUTABLE|url^0|0|0|16|0|0^^$0|@$1|2|3|4|5|6|7|M|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|N|8|@]|9|@$D|O|E|P|1|Q]]|A|$]]|$1|F|3|-4|5|6|7|R|8|@]|9|@]|A|$]]]|G|$H|$5|I|J|K|A|$L|C]]]]

<p>I don't think the scrollTop is a valid property. If you want to animate scrolling, try the scrollTo plugin for jquery</p>

<p><a href="http://plugins.jquery.com/project/ScrollTo" rel="nofollow noreferrer">http://plugins.jquery.com/project/ScrollTo</a></p>


blocks|key|1008511|text|尝试使用$("html,body").animate({+scrollTop:+0+},+"slow");|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|1008512|这对我在chrome中是有效的。|1008513|entityMap^0|4|1D|0|0^^$0|@$1|2|3|4|5|6|7|J|8|@$9|K|A|L|B|C]]|D|@]|E|$]]|$1|F|3|G|5|6|7|M|8|@]|D|@]|E|$]]|$1|H|3|-4|5|6|7|N|8|@]|D|@]|E|$]]]|I|$]]

<p>Try using  <code>$("html,body").animate({ scrollTop: 0 }, "slow");</code></p>

<p>This works for me in chrome.</p>


blocks|key|1008548|text|我已经在Chrome、Firefox和Safari中成功地使用了它。还不能在IE中测试它。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1008549|if($(document).scrollTop()+!=0){
++++$('html,+body').animate({+scrollTop:+0+},+'fast');
}|code-block|syntax|javascript|1008550|使用"+if“语句的原因是检查用户是否在站点顶部做好了一切准备。如果是这样，请不要制作动画。这样我们就不必太担心屏幕分辨率了。|1008551|我使用$(document).scrollTop而不是ie的原因。$('html,body')是因为某些原因Chrome总是返回0。|offset|length|style|CODE|1008552|entityMap^0|0|0|0|3|L|X|E|0^^$0|@$1|2|3|4|5|6|7|Q|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|R|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|S|8|@]|9|@]|A|$]]|$1|I|3|J|5|6|7|T|8|@$K|U|L|V|M|N]|$K|W|L|X|M|N]]|9|@]|A|$]]|$1|O|3|-4|5|6|7|Y|8|@]|9|@]|A|$]]]|P|$]]

<p>I have used this with success in Chrome, Firefox, and Safari. Haven't been able to test it in IE yet.</p>

<pre><code>if($(document).scrollTop() !=0){
    $('html, body').animate({ scrollTop: 0 }, 'fast');
}
</code></pre>

<p>The reason for the "if" statement is to check if the user is all ready at the top of the site. If so, don't do the animation. That way we don't have to worry so much about screen resolution.</p>

<p>The reason I use <code>$(document).scrollTop</code> instead of ie. <code>$('html,body')</code> is cause Chrome always return 0 for some reason. </p>


blocks|key|1008588|text|如果您将scrollTop()与‘document’一起使用，则它在两种浏览器中都有效：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1008589|$(document).scrollTop();|code-block|syntax|javascript|1008590|'html‘或’...instead‘的正文。否则，它不会同时在两个浏览器中工作。|1008591|entityMap^0|0|0|0^^$0|@$1|2|3|4|5|6|7|K|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|L|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|M|8|@]|9|@]|A|$]]|$1|I|3|-4|5|6|7|N|8|@]|9|@]|A|$]]]|J|$]]

<p>It works in both browsers if you use scrollTop() with 'document':</p>

<pre><code>$(document).scrollTop();
</code></pre>

<p>...instead of 'html' or 'body'. Other way it won't work at the same time in both browsers.</p>


blocks|key|1223049|text|//+if+we+are+not+already+in+top+then+see+if+browser+needs+html+or+body+as+selector
var+obj+=+$('html').scrollTop()+!==+0+?+'html'+:+'body';

//+then+proper+delegate+using+on,+with+following+line:
$(obj).animate({+scrollTop:+0+},+"slow");|type|code-block|depth|inlineStyleRanges|entityRanges|data|syntax|javascript|1223050|但是，最好的方法是只使用原生api将id滚动到视区中(因为您无论如何都会滚动到顶部，这可能只是您的外部div)：|unstyled|1223051|document.getElementById('wrapperIDhere').scrollIntoView(true);|1223052|entityMap^0|0|0|0^^$0|@$1|2|3|4|5|6|7|K|8|@]|9|@]|A|$B|C]]|$1|D|3|E|5|F|7|L|8|@]|9|@]|A|$]]|$1|G|3|H|5|6|7|M|8|@]|9|@]|A|$B|C]]|$1|I|3|-4|5|F|7|N|8|@]|9|@]|A|$]]]|J|$]]

<pre><code>// if we are not already in top then see if browser needs html or body as selector
var obj = $('html').scrollTop() !== 0 ? 'html' : 'body';

// then proper delegate using on, with following line:
$(obj).animate({ scrollTop: 0 }, "slow");
</code></pre>

<p>BUT, best approach is to scroll an id into your viewport using just native api (since you scroll to top anyway this can be just your outer div):</p>

<pre><code>document.getElementById('wrapperIDhere').scrollIntoView(true);
</code></pre>


blocks|key|1008686|text|我使用：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1008687|var+$scrollEl+=+$.browser.mozilla+?+$('html')+:+$('body');|code-block|syntax|javascript|1008688|因为读取jQuery+scrollTop+not+working+in+Chrome+but+working+in+Firefox|offset|length|1008689|entityMap|0|LINK|mutability|MUTABLE|url|https://stackoverflow.com/questions/3042651/jquery-scrolltop-not-working-in-chrome-but-working-in-firefox#comment23659920_3042875^0|0|0|4|1P|0|0^^$0|@$1|2|3|4|5|6|7|S|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|T|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|U|8|@]|9|@$I|V|J|W|1|X]]|A|$]]|$1|K|3|-4|5|6|7|Y|8|@]|9|@]|A|$]]]|L|$M|$5|N|O|P|A|$Q|R]]]]

<p>I use:</p>

<pre><code>var $scrollEl = $.browser.mozilla ? $('html') : $('body');
</code></pre>

<p>because read <a href="https://stackoverflow.com/questions/3042651/jquery-scrolltop-not-working-in-chrome-but-working-in-firefox#comment23659920_3042875">jQuery scrollTop not working in Chrome but working in Firefox</a></p>


blocks|key|1223147|text|滚动正文并检查是否正常工作：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1223148|function+getScrollableRoot()+{
++++var+body+=+document.body;
++++var+prev+=+body.scrollTop;
++++body.scrollTop%2B%2B;
++++if+(body.scrollTop+===+prev)+{
++++++++return+document.documentElement;
++++}+else+{
++++++++body.scrollTop--;
++++++++return+body;
++++}
}


$(getScrollableRoot()).animate({+scrollTop:+0+},+"slow");|code-block|syntax|javascript|1223149|这比$("html,+body").animate更有效，因为只使用一个动画，而不是两个。因此，只有一个回调触发，而不是两个。|offset|length|style|CODE|1223150|entityMap^0|0|0|2|N|0^^$0|@$1|2|3|4|5|6|7|O|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|P|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|Q|8|@$I|R|J|S|K|L]]|9|@]|A|$]]|$1|M|3|-4|5|6|7|T|8|@]|9|@]|A|$]]]|N|$]]

<p>Scroll body and check if it worked:</p>

<pre><code>function getScrollableRoot() {
    var body = document.body;
    var prev = body.scrollTop;
    body.scrollTop++;
    if (body.scrollTop === prev) {
        return document.documentElement;
    } else {
        body.scrollTop--;
        return body;
    }
}


$(getScrollableRoot()).animate({ scrollTop: 0 }, "slow");
</code></pre>

<p>This is more efficient than <code>$("html, body").animate</code> because only one animation used, not two. Thus, only one callback fires, not two.</p>


blocks|key|1008772|text|如果您的CSS+html元素具有以下overflow标记，则scrollTop将不起作用。|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|1008773|html+{
++++overflow-x:+hidden;
++++overflow-y:+hidden;
}|code-block|syntax|javascript|1008774|要允许scrollTop滚动，请修改您的标记，从html元素中删除overflow标记，然后附加到body元素。|1008775|body+{+
++++overflow-x:+hidden;
++++overflow-y:+hidden;
}|1008776|entityMap^0|8|4|I|8|U|9|0|0|3|9|O|4|X|8|1D|4|0|0^^$0|@$1|2|3|4|5|6|7|Q|8|@$9|R|A|S|B|C]|$9|T|A|U|B|C]|$9|V|A|W|B|C]]|D|@]|E|$]]|$1|F|3|G|5|H|7|X|8|@]|D|@]|E|$I|J]]|$1|K|3|L|5|6|7|Y|8|@$9|Z|A|10|B|C]|$9|11|A|12|B|C]|$9|13|A|14|B|C]|$9|15|A|16|B|C]]|D|@]|E|$]]|$1|M|3|N|5|H|7|17|8|@]|D|@]|E|$I|J]]|$1|O|3|-4|5|6|7|18|8|@]|D|@]|E|$]]]|P|$]]

<p>If your CSS <code>html</code> element has the following <code>overflow</code> markup, <code>scrollTop</code> will not function.</p>

<pre><code>html {
    overflow-x: hidden;
    overflow-y: hidden;
}
</code></pre>

<p>To allow <code>scrollTop</code> to scroll, modify your markup remove <code>overflow</code> markup from the <code>html</code> element and append to a <code>body</code> element.  </p>

<pre><code>body { 
    overflow-x: hidden;
    overflow-y: hidden;
}
</code></pre>


blocks|key|1223237|text|解决此问题的更好方法是使用如下所示的函数：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1223238|function+scrollToTop(callback,+q)+{

++++if+($('html').scrollTop())+{
++++++++$('html').animate({+scrollTop:+0+},+function()+{
++++++++++++console.log('html+scroll');
++++++++++++callback(q)
++++++++});
++++++++return;
++++}

++++if+($('body').scrollTop())+{
++++++++$('body').animate({+scrollTop:+0+},+function()+{
++++++++++++console.log('body+scroll');
++++++++++++callback(q)
++++++++});
++++++++return;
++++}

++++callback(q);
}|code-block|syntax|javascript|1223239|这将适用于所有浏览器，并防止FireFox向上滚动两次(如果您使用公认的答案-$("html,body").animate({+scrollTop:+0+},+"slow");，就会发生这种情况)。|offset|length|style|CODE|1223240|entityMap^0|0|0|13|1D|0^^$0|@$1|2|3|4|5|6|7|O|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|P|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|Q|8|@$I|R|J|S|K|L]]|9|@]|A|$]]|$1|M|3|-4|5|6|7|T|8|@]|9|@]|A|$]]]|N|$]]

<p>A better way to solve this problem is to use a function like this:</p>

<pre><code>function scrollToTop(callback, q) {

    if ($('html').scrollTop()) {
        $('html').animate({ scrollTop: 0 }, function() {
            console.log('html scroll');
            callback(q)
        });
        return;
    }

    if ($('body').scrollTop()) {
        $('body').animate({ scrollTop: 0 }, function() {
            console.log('body scroll');
            callback(q)
        });
        return;
    }

    callback(q);
}
</code></pre>

<p>This will work across all browsers and prevents FireFox from scrolling up twice (which is what happens if you use the accepted answer - <code>$("html,body").animate({ scrollTop: 0 }, "slow");</code>).</p>


blocks|key|1008895|text|在Chrome，Firefox和Edge上测试，对我来说唯一运行良好的解决方案是这样使用setTimeout和Aaron的解决方案：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1008896|setTimeout(+function+()+{
++++$('body,+html').stop().animate({+scrollTop:+0+},+100);
},+500);|code-block|syntax|javascript|1008897|当我在Chrome和Edge中为我重新加载页面时，其他解决方案都没有重置之前的scrollTop。不幸的是，Edge中仍然有一个小的"flick“。|1008898|entityMap^0|0|0|0^^$0|@$1|2|3|4|5|6|7|K|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|L|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|M|8|@]|9|@]|A|$]]|$1|I|3|-4|5|6|7|N|8|@]|9|@]|A|$]]]|J|$]]

<p>Testing on Chrome, Firefox and Edge, the only solution that worked fine for me is using setTimeout with the solution of Aaron in this way:</p>

<pre><code>setTimeout( function () {
    $('body, html').stop().animate({ scrollTop: 0 }, 100);
}, 500);
</code></pre>

<p>No one of the other solutions resetted the previuos scrollTop, when I reloaded the page, in Chrome and Edge for me.
Unfortunately there is still a little "flick" in Edge.</p>


blocks|key|1223376|text|所以我也有这个问题，我写了这个函数：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1223377|​|1223378|/***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+=+$("#"%2BelmId),
		contenerJS+=+document.getElementById(elmId);
	if(contener.length+!==+0){
		var	
			elmFullHeight+=+
				contener.height()%2B
				parseInt(contener.css("padding-top").slice(0,-2))%2B
				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){
			$("#"%2BelmId).unbind("scroll");
			$.post(ajaxLink,postParameterObject)
			+.done(function(data){
			+	if(data.length+!=+0){
					$("#"%2BelmId).append(data);
					$("#"%2BelmId).scroll(function+(){
						fuweco_reloaderMore(elmId,ajaxLink,postParameterObject);
					});
				}
			+});
		}
	}
}
/***Working+function+for+ajax+loading+End*******************/
/***Sample+function+Start***********************************/
function+reloaderMore(elementId)+{
	var
		contener+=+$("#"%2BelementId),
		contenerJS+=+document.getElementById(elementId)
	;

++++if(contener.length+!==+0){
++++	var
			elmFullHeight+=+contener.height()%2B(parseInt(contener.css("padding-top").slice(0,-2))%2BparseInt(contener.css("padding-bottom").slice(0,-2))),
			SC_scrollTop+=+contenerJS.scrollTop,
			SC_max_scrollHeight+=+contenerJS.scrollHeight-elmFullHeight
		;
		if(SC_scrollTop+>=+SC_max_scrollHeight+-+200){
			$("#"%2BelementId).unbind("scroll");
			$("#"%2BelementId).append('<div+id="elm1"+style="margin-bottom:15px;"><h1>Was+loaded</h1><p>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.</p></div>');
			$("#"%2BelementId).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*********************************/|code-block|syntax|javascript|1223379|.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;
}|1223380|<script+src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script>
	<div+class="reloader"+id="t1">
		<div+id="elm1"+style="margin-bottom:15px;">
			<h1>Some+text+for+header.</h1>
			<p>
				Some+text+for+content.<br>
				Some+text+for+content.<br>
				Some+text+for+content.<br>
				Some+text+for+content.<br>
				Some+text+for+content.<br>
				Some+text+for+content.<br>
				Some+text+for+content.<br>
				Some+text+for+content.<br>
				Some+text+for+content.<br>
				Some+text+for+content.<br>
				Some+text+for+content.<br>
				Some+text+for+content.<br>
			</p>
		</div>
		<div+id="elm2"+style="margin-bottom:15px;">
			<h1>Some+text+for+header.</h1>
			<p>
				Some+text+for+content.<br>
				Some+text+for+content.<br>
				Some+text+for+content.<br>
				Some+text+for+content.<br>
				Some+text+for+content.<br>
				Some+text+for+content.<br>
				Some+text+for+content.<br>
				Some+text+for+content.<br>
				Some+text+for+content.<br>
				Some+text+for+content.<br>
				Some+text+for+content.<br>
				Some+text+for+content.<br>
			</p>
		</div>
		<div+id="elm3"+style="margin-bottom:15px;">
			<h1>Some+text+for+header.</h1>
			<p>
				Some+text+for+content.<br>
				Some+text+for+content.<br>
				Some+text+for+content.<br>
				Some+text+for+content.<br>
				Some+text+for+content.<br>
				Some+text+for+content.<br>
				Some+text+for+content.<br>
				Some+text+for+content.<br>
				Some+text+for+content.<br>
				Some+text+for+content.<br>
				Some+text+for+content.<br>
				Some+text+for+content.<br>
			</p>
		</div>		
	</div>|1223381|1223382|我希望它能对其他程序员有所帮助。|1223383|entityMap^0|0|0|0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|R|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|S|8|@]|9|@]|A|$]]|$1|D|3|E|5|F|7|T|8|@]|9|@]|A|$G|H]]|$1|I|3|J|5|F|7|U|8|@]|9|@]|A|$G|H]]|$1|K|3|L|5|F|7|V|8|@]|9|@]|A|$G|H]]|$1|M|3|C|5|6|7|W|8|@]|9|@]|A|$]]|$1|N|3|O|5|6|7|X|8|@]|9|@]|A|$]]|$1|P|3|-4|5|6|7|Y|8|@]|9|@]|A|$]]]|Q|$]]

<p>So I was having this problem too and I have written this function:</p>

<p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
<div class="snippet-code">
<pre class="snippet-code-js lang-js prettyprint-override"><code>/***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 &gt;= 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 &gt;= SC_max_scrollHeight - 200){
			$("#"+elementId).unbind("scroll");
			$("#"+elementId).append('&lt;div id="elm1" style="margin-bottom:15px;"&gt;&lt;h1&gt;Was loaded&lt;/h1&gt;&lt;p&gt;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.&lt;/p&gt;&lt;/div&gt;');
			$("#"+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*********************************/</code></pre>
<pre class="snippet-code-css lang-css prettyprint-override"><code>.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;
}</code></pre>
<pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"&gt;&lt;/script&gt;
	&lt;div class="reloader" id="t1"&gt;
		&lt;div id="elm1" style="margin-bottom:15px;"&gt;
			&lt;h1&gt;Some text for header.&lt;/h1&gt;
			&lt;p&gt;
				Some text for content.&lt;br&gt;
				Some text for content.&lt;br&gt;
				Some text for content.&lt;br&gt;
				Some text for content.&lt;br&gt;
				Some text for content.&lt;br&gt;
				Some text for content.&lt;br&gt;
				Some text for content.&lt;br&gt;
				Some text for content.&lt;br&gt;
				Some text for content.&lt;br&gt;
				Some text for content.&lt;br&gt;
				Some text for content.&lt;br&gt;
				Some text for content.&lt;br&gt;
			&lt;/p&gt;
		&lt;/div&gt;
		&lt;div id="elm2" style="margin-bottom:15px;"&gt;
			&lt;h1&gt;Some text for header.&lt;/h1&gt;
			&lt;p&gt;
				Some text for content.&lt;br&gt;
				Some text for content.&lt;br&gt;
				Some text for content.&lt;br&gt;
				Some text for content.&lt;br&gt;
				Some text for content.&lt;br&gt;
				Some text for content.&lt;br&gt;
				Some text for content.&lt;br&gt;
				Some text for content.&lt;br&gt;
				Some text for content.&lt;br&gt;
				Some text for content.&lt;br&gt;
				Some text for content.&lt;br&gt;
				Some text for content.&lt;br&gt;
			&lt;/p&gt;
		&lt;/div&gt;
		&lt;div id="elm3" style="margin-bottom:15px;"&gt;
			&lt;h1&gt;Some text for header.&lt;/h1&gt;
			&lt;p&gt;
				Some text for content.&lt;br&gt;
				Some text for content.&lt;br&gt;
				Some text for content.&lt;br&gt;
				Some text for content.&lt;br&gt;
				Some text for content.&lt;br&gt;
				Some text for content.&lt;br&gt;
				Some text for content.&lt;br&gt;
				Some text for content.&lt;br&gt;
				Some text for content.&lt;br&gt;
				Some text for content.&lt;br&gt;
				Some text for content.&lt;br&gt;
				Some text for content.&lt;br&gt;
			&lt;/p&gt;
		&lt;/div&gt;		
	&lt;/div&gt;</code></pre>
</div>
</div>
</p>

<p>I hope it will be helpfully for other programmers.</p>


blocks|key|1223416|text|如果这一切工作的Mozilla，与html，正文选择器，然后有一个很好的机会，问题是与溢出有关，如果在html或正文中的溢出设置为自动，那么这将导致铬不能很好地工作，因为当它被设置为自动时，动画上的scrollTop属性将不工作，我不知道确切的原因！但是解决方案是省略溢出，不要设置它！这为我解决了这个问题！如果您要将其设置为自动，请将其取消！|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1223417|如果您将其设置为隐藏，则按照"user2971963“答案中所述进行操作(使用ctrl%2Bf查找它)。希望这是有用的！|1223418|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|F|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|G|8|@]|9|@]|A|$]]|$1|D|3|-4|5|6|7|H|8|@]|9|@]|A|$]]]|E|$]]

<p>If it work all fine for Mozilla, with html,body selector, then there is a good chance that the problem is related to the overflow, if the overflow in html or body is set to auto, then this will cause chrome to not work well, cause when it is set to auto, scrollTop property on animate will not work, i don't know exactly why! but the solution is to omit the overflow, don't set it! that solved it for me! if you are setting it to auto, take it off!  </p>

<p>if you are setting it to hidden, then do as it is described in "user2971963" answer (ctrl+f to find it).  hope this is useful!</p>


blocks|key|1009004|text|+$("html,+body").animate({+scrollTop:+0+},+"slow");|type|code-block|depth|inlineStyleRanges|entityRanges|data|syntax|javascript|1009005|此CSS与滚动到顶部冲突，因此请注意此问题|unstyled|1009006|+html,+body+{
+++++++++overflow-x:+hidden;++++++++
++++}|1009007|entityMap^0|0|0|0^^$0|@$1|2|3|4|5|6|7|K|8|@]|9|@]|A|$B|C]]|$1|D|3|E|5|F|7|L|8|@]|9|@]|A|$]]|$1|G|3|H|5|6|7|M|8|@]|9|@]|A|$B|C]]|$1|I|3|-4|5|F|7|N|8|@]|9|@]|A|$]]]|J|$]]

<pre><code> $("html, body").animate({ scrollTop: 0 }, "slow");
</code></pre>

<p>This CSS conflict with scroll to top so take care of this   </p>

<pre><code> html, body {
         overflow-x: hidden;        
    }
</code></pre>


blocks|key|1223484|text|我发现问题出在我的CSS上。我从我的样式表中删除了它，它工作得很好。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1223485|*{scroll-behavior:+smooth;}|code-block|syntax|javascript|1223486|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|I|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|J|8|@]|9|@]|A|$E|F]]|$1|G|3|-4|5|6|7|K|8|@]|9|@]|A|$]]]|H|$]]

<p>I found that my CSS was the issue. I removed this from my style sheet and it worked fine.</p>
<pre><code>*{scroll-behavior: smooth;}
</code></pre>


<p>I have used a <code>scrollTop</code> function in jQuery for navigating to top, but strangely 'the smooth animated scroll' stopped working in Safari and Chrome (scrolling without smooth animation) after I made some changes. </p>

<p>But it is still working smoothly in Firefox. What could be wrong?</p>

<p>Here is the jQuery function I used,</p>

<p>jQuery:</p>

<pre><code>$('a#gotop').click(function() {
    $("html").animate({ scrollTop: 0 }, "slow");
    //alert('Animation complete.');
    //return false;
});
</code></pre>

<p>HTML</p>

<pre><code>&lt;a id="gotop" href="#"&gt;Go Top &lt;/a&gt;
</code></pre>

<p>CSS</p>

<pre class="lang-css prettyprint-override"><code>#gotop {
      cursor: pointer;
      position: relative;
      float: right;
      right: 20px;
      /*top:0px;*/
}
</code></pre>


jQuery scrollTop not working in Chrome but working in Firefox

翻译质量差，导致语言生硬或混乱。

没有提供实际的解决方法或示例。

解答不清晰，无法理解或解决问题。

页面排版不美观，阅读体验差。

文章

问答

视频

学习中心

腾讯云实验室

直播

竞赛

腾讯云代码分析专区

腾讯iOA零信任安全管理系统专区

腾讯云架构师技术同盟交流圈

腾讯云数据库专区

腾讯云顾问专区

腾讯云原生专区

腾讯混元专区

腾讯云TCE专区

腾讯云Lighthouse专区

腾讯云HAI专区

腾讯云Edgeone专区

腾讯云存储专区

腾讯云智能专区

腾讯轻联专区 

腾讯云开发专区

TAPD专区

腾讯轻量云游戏服专区

腾讯云最具价值专家

腾讯云架构师技术同盟

腾讯云创作之星

腾讯云开发者先锋 

腾讯云代码助手

CODING DevOps

Cloud Studio

SDK中心

API中心

命令行工具

我使用了jQuery中的scrollTop函数来导航到顶部，但奇怪的是，在我做了一些更改后，“平滑动画滚动”在Safari和Chrome中停止工作(滚动没有平滑动画)。但它在Firefox中仍然运行得很流畅。会出什么问题呢？下面是我使用的jQuery函数，jQuery：$('a#gotop').click(functi...

问jQuery scrollTop在Chrome中不起作用，但在Firefox中起作用
EN

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问jQuery scrollTop在Chrome中不起作用，但在Firefox中起作用EN