返回首页，平滑滚动

Question

I hava a button in a form ,I want when this button clicked the scroll back to top of page .my java script function is: 我有一个表单按钮，我想当此按钮单击滚动回到页面顶部时。我的Java脚本函数是：

function handleResponse() {
       window.scrollBy(0,0).fadeIn('smooth')
}

and in my form is: 以我的形式是：

 <p:commandButton icon="ui-icon-arrowthick-1-n" onclick="handleResponse" immediate="true"/>

but page is refreshed,instead of scrooling smoothy in top,what is solution? 但是页面会刷新，而不是在顶部平滑地滚动，怎么办？

Answer 1

Try below code. 尝试下面的代码。 Hope it works. 希望它能工作。

$("#handleResponse").click(function() {
  $("html, body").animate({ scrollTop: 0 }, "slow");
  return false;
});

Answer 2

Just add this after the <body> tag: 只需在<body>标记后添加它：

<!--Back to top Button-->
    <a href="#" id="btt" title="Back to Top" style="display: none;"><span></span></a>
<!--Back to top Button-->

CSS: CSS：

#btt {
  position:fixed;
  right:10px;
  bottom:10px;
  cursor:pointer;
  width:50px;
  height:50px;
  background-color:#019934;
  display:none;
  -webkit-border-radius:60px;
  -moz-border-radius:60px;
  border-radius:60px; }

#btt span {
  position:absolute;
  top:8%;
  left:40%;
  margin-left:-8px;
  margin-top: 0px;
  height:0;
  width:0;
  border:13px solid transparent;
  border-bottom-color:#ffffff; }

#btt:hover {
  background-color:#254117;
  opacity:1;filter:"alpha(opacity=100)";
  -ms-filter:"alpha(opacity=100)"; }

and script: 和脚本：

$(document).ready(function(){ 

$(window).scroll(function(){ 

    if ($(this).scrollTop() > 100) { 

        $('#btt').fadeIn(); 

    } else { 

        $('#btt').fadeOut(); 

    } 

}); 

$('#btt').click(function(){ 

    $("html, body").animate({ scrollTop: 0 }, 600); 

    return false; 

}); });

返回首页，平滑滚动

问题描述

2 个解决方案

解决方案1
2 2015-04-14 10:17:14

解决方案2
0 2018-02-27 02:47:35

返回首页，平滑滚动

问题描述

2 个解决方案

解决方案1 2 2015-04-14 10:17:14

解决方案2 0 2018-02-27 02:47:35

解决方案1
2 2015-04-14 10:17:14

解决方案2
0 2018-02-27 02:47:35