个人中心
文章发布
退出
作者热门文章
- c - 在位数组中找到第一个零
- linux - Unix 显示有关匹配两种模式之一的文件的信息
- 正则表达式替换多个文件
- linux - 隐藏来自 xtrace 的命令
24
4
我创建了一个方法，每次单击它时都会转到页面顶部。问题是，我希望仅当您已经向下滚动时才显示此按钮，而不仅仅是默认按钮。我该如何定义它？这是我的代码:
显示/隐藏按钮 - 不起作用:
scrollFunction() {
if (document.body.scrollTop > 5 || document.documentElement.scrollTop >5) {
document.getElementById("myBtn").style.display = "block";
} else {
document.getElementById("myBtn").style.display = "none";
}
}
滚动到顶部 - 有效:
topFunction() {
document.body.scrollTop = 0; // For Safari
document.documentElement.scrollTop = 0;
}
谢谢。
最佳答案
我使用这段代码，只需更改 css 以满足您的需要。
$(document).ready(function() {
$(window).scroll(function() {
if ($(this).scrollTop() > 100) {
$('#scroll').fadeIn();
} else {
$('#scroll').fadeOut();
}
});
$('#scroll').click(function() {
$("html, body").animate({
scrollTop: 0
}, 600);
return false;
});
});#scroll {
position: fixed;
right: 10px;
bottom: 10px;
cursor: pointer;
width: 50px;
height: 50px;
background-color: #3498db;
text-indent: -9999px;
display: none;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
}
#scroll span {
position: absolute;
top: 50%;
left: 50%;
margin-left: -8px;
margin-top: -12px;
height: 0;
width: 0;
border: 8px solid transparent;
border-bottom-color: #ffffff
}
#scroll:hover {
background-color: #e74c3c;
opacity: 1;
filter: "alpha(opacity=100)";
-ms-filter: "alpha(opacity=100)";
}<head>
<meta charset="utf-8">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
</head>
<body>
<!-- BackToTop Button -->
<a href="javascript:void(0);" id="scroll" title="Scroll to Top" style="display: none;">Top<span> </span></a>
<p>Example text</p>
<p>Example text</p>
<p>Example text</p>
<p>Example text</p>
<p>Example text</p>
<p>Example text</p>
<p>Example text</p>
<p>Example text</p>
<p>Example text</p>
<p>Example text</p>
<p>Example text</p>
<p>Example text</p>
</body>关于javascript - 向下滚动后转到首页按钮，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/51092605/
24
4
0
给定默认路由，以下任一 URL 将导航到 Home Controller 的 Index 方法: 1. http://localhost 2. http://localhost/Home/Inde
可以在“设置”>“阅读”下找到 WordPress 阅读设置。 我将 WordPress 的“首页显示”选项设置为“静态首页”。 我的“首页”设置为“关于”。 我正在尝试为注销和登录用户设置不同的首页
我正在尝试禁用 Wordpress 首页上的插件，以使其更轻一些。我只想在显示首页时禁用它。 我在 wp-content/mu-plugins/中放置了这个工作代码它会禁用除指定/子页面/之外的所有页
有没有一种方法可以使首页包含 2 个 View ，而不使用 Drupal 6.x 中的面板模块？ 谢谢 最佳答案 如果您不想使用面板，您可以将 2 个 View 创建为 block (就像侧边栏等一样
已关闭。此问题不符合Stack Overflow guidelines 。目前不接受答案。 这个问题似乎不是关于 a specific programming problem, a software
我尝试管理基于 Plone 的网站 www.capital-tennis.org 上的内容。我对 Plone 本身几乎一无所知。 我想向网站的首页(主页面)添加 2 个 portlet，一个在左侧(在
如图所示，底部有 3 个 Controller ，分别是(HomeTableViewController、NavigationViewController 和 NewsViewController)
我开始在Windows上使用pentaho BI Server 5.2，并尝试通过本教程使用mysql配置进行安装： https://anonymousbi.wordpress.com/2013/12
我的首页(也就是发布帖子的页面)上的链接是红色的，悬停时它们会变成白色。但是在我的 STATIC 页面上，我希望链接在悬停时为白色和红色，我该怎么做？ Tumblr 允许将 html 添加到您的静态页
我想创建一个网站 ala failblog.org，用户可以在其中提交内容并对内容进行投票 我想做的是 一种。向节点/文章添加一个字段，称为“front_page_at (date_time)” 湾。
注意:不能使用 Javascript 或 iframe。事实上，我不能相信客户端浏览器可以做任何事情，除了最基本的事情。 我正在将遗留的 PHP4 应用程序重建为 MVC 应用程序，目前我的大部分研究
我在这里不知所措。我觉得我已经尝试了所有的方法，并使用了其他帖子/教程中解释的确切方法。我知道您需要使用光标并设置第一个和最后一个可见文档，以便在向前移动的情况下从最后一个文档开始，在向后移动的情况下
我是一名优秀的程序员,十分优秀！