1

我正在使用对象标记代码创建我的产品页面，但是每次单击“查看”按钮时，下一页都停留在我刚刚查看的上一页的相同位置。如何添加让我每次单击“查看”按钮时都可以从页面顶部查看的功能？

<div id="container" class="clearfix"><!--! end of #sidebar -->
    <div class="holder"></div>
    <div id="content" class="defaults"><!-- navigation holder -->
        <div id="title2">Office Section</div>

        <!-- item container -->
        <ul id="itemContainer">
            <li>
                <div id="product">
                    <div id="title">FuBang®</div>
                    <div class="imageOuter" style="margin:0">
                        <a class="image" href="officesection010.html">
                            <span class="rollover" ></span>
                            <img class="imgborder" src="product/officesection/010.jpg" width="165" height="165" />
                        </a>
                    </div><br />
                    <div id="text">Sofa </div><br />
                    <div id="button">
                        <a href="officesection010.html">View Details</a>
                    </div>
                </div>
            </li>
        </ul>
        <br />
        <div id="title2"></div>
        <div class="holder"></div>
    </div>
    </div> <!--! end of #content -->
</div> <!--! end of #container -->

当我单击此处特定位置“x”处的“查看详细信息”按钮时：http: //postimg.org/image/vgs0lwhtr/

下一页显示相同的位置“x”，但我希望它跳转到页面顶部：http: //postimg.org/image/vn80e2lph/

4

8 回答 8

12

使用 Javascript：

document.body.scrollTop = document.documentElement.scrollTop = 0;

使用 jQuery：

$(function() {
   $('body').scrollTop(0);
});
于 2013-10-11T06:09:07.737 回答
4 
<a href="#" ID="backToTop"></a>

jQuery(document).ready(function($){
    $(window).scroll(function(){
        if ($(this).scrollTop() > 50) {
            $('#backToTop').fadeIn('slow');
        } else {
            $('#backToTop').fadeOut('slow');
        }
    });
    $('#backToTop').click(function(){
        $("html, body").animate({ scrollTop: 0 }, 500);
        //$("html, body").scrollTop(0); //For without animation
        return false;
    });
});

请参考这个，这可能会有所帮助

于 2013-10-11T06:29:24.130 回答
3

如果您当前的内容是通过 jQuery 生成的（就像我的情况一样），有时将滚动放置到正文不起作用。在这种情况下，您可以执行以下操作。

$(function() {
   $('html').scrollTop(0);
});
于 2016-05-04T09:48:37.430 回答
1

用于在页面部分之间跳转的简单 HTML 解决方案

// Place a tag like this where you would like to go
// in your case at the top
<a name="top"></a>

// you will reach there by click of this link  better use an image reach their by clicking on this we can also use an image, align in right 

<a href="#top">last</a>
于 2013-10-11T07:06:45.843 回答
1

Subhash 的 jQuery 解决方案的一个小问题是，您必须在其中调用此代码$(document).ready()才能使$('body')选择器工作。ready在您的部分页面呈现到屏幕之前，该事件可能不会触发。

更好的方法是简单地修改用户的位置作为此浏览器“功能”的解决方法：

//Above all of your $(document).ready(...) code
document.location = "#";
于 2013-10-11T06:12:56.207 回答
1

返回顶部按钮，适用于所有浏览器。要更改滚动速度，只需x在counter -= x此处更改x = 10

function scrollToTop(){
var myBody = document.body;
var id = setInterval(secondFunction,1);
var height = window.pageYOffset;
var counter = height;
function secondFunction(){
	if(window.pageYOffset == 0){
		clearInterval(id);
	}
	else {
		if(!!navigator.userAgent.match(/Trident/g) || !!navigator.userAgent.match(/MSIE/g)){
		counter -= 10;
		counter--;	
		document.documentElement.scrollTop = counter;
		}
		else {
			counter -= 10;
			counter--;
			myBody.scrollTop = counter;
		}
	}
}
}
body {
  height: 5000px;
  margin: 0;
  padding: 0;
}
.backToTop {
  position: fixed;
  /* Fixed at page */
  top: auto;
  bottom: 20px;
  left: auto;
  right: 20px;
  background-color: crimson;
  color: white;
  padding: 5px;
  cursor: pointer;
}
header {
   position: relative;
  top: 0;
  left: 0;
  width: 100%;
  height: 100px;
  background-color: black;
  }
<!-- back to top button -->
<span class="backToTop" onclick="scrollToTop()">TOP</span>
<!-- Header -->
<header>
  </header>

于 2016-10-19T10:59:42.033 回答
0

<body>在标签中分配一个 id="#body" 和 tabindex

<body id="#body" tabindex="1">

并使用 jquery focus()

$(function() {
    $("#body").attr("tabindex",-1).focus();
}
于 2013-10-11T07:00:33.417 回答
0

您可以使用此方法：

function gototop() {
    if (window.scrollY>0) {
        window.scrollTo(0,window.scrollY-20)
        setTimeout("gototop()",10)
    }
}
于 2017-02-01T18:08:01.683 回答