返回页首链接iFrame？

Question

我正在尝试创建一个链接，当您单击它时会将您带到页面顶部。我已经在每个页面上都有页眉和页脚。它们使用iFrame嵌入。现在，我想把

<a name="top"></a>

标题上的

和

<a href="#top"></a>

在页脚上

。但是当我添加它们时，当我点击链接时没有任何反应。我尝试添加target =“_ top”，但只是在新选项卡中打开页脚。

是否有人知道如何编写html以便在点击页脚中的链接后将其带到当前页面的顶部？

Answer 1

将标题中的<a>更改为<a id="top">

请参阅此fiddle。

Answer 2

在嵌入页眉和页脚的页面上应用此代码。 的 JSFIDDLE

在head部分中应用此脚本

＆＃13;

＆＃13;

<script>
    $(document).ready(function(){

//Check to see if the window is top if not then display button
$(window).scroll(function(){
	if ($(this).scrollTop() > 100) {
		$('.scrollToTop').fadeIn();
	} else {
		$('.scrollToTop').fadeOut();
	}
});

//Click event to scroll to top
$('.scrollToTop').click(function(){
	$('html, body').animate({scrollTop : 0},200);
	return false;
});

});
</script>

＆＃13;

.fixedscrolltotop
{
position: fixed;
bottom: 25%;
right: 0;
width: 149px;
color:black;
font-weight:bold;
text-align:center;
-webkit-box-flex:1;
}
.scrollToTop
{
width:80px; 
height:80px; 
text-align:center; 
background: whiteSmoke;
font-weight: bold;
color: #444;
text-decoration: none;
position:fixed;
bottom:60px;
right:0px;
display:none;
background: url('http://tech.firstpost.com/wp-content/uploads/up-arrow-icon.png') no-repeat;
background-size: 100% 100%;
opacity: 0.5;
-webkit-box-flex:1;
}
.scrollToTop:hover
{
text-decoration:none;
opacity: 1;
-webkit-box-flex:1;
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="fixedscrolltotop">
    <a href="" class="scrollToTop" title="Back To The Top">
    </a>
</div>

＆＃13;

＆＃13;

＆＃13;

这个代码是否合适如果展望其他东西请告诉我