一.最简单的静态返回顶部
1.
用命名锚点击返回到顶部预设的id为top的元素
<a href="#top“>返回顶部</a>
2.
操作scrooll函数用来控制滚动条的位置（第一个参数是水平位置，第二个参数是垂直位置）
<a href="javascript:scroll(0,0)">返回顶部</a>
二.简单的静态返回顶部，用js模拟滚动效果
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title></title>
<style>
#btn {
position: fixed;
bottom: 0;
}
</style>
</head>
<body style="height: 10000px">
<a href="javascript:;" id="btn">回到顶部</a>
<script>
window.onload = function(){
var btn = document.getElementById('btn');
// 获取视界高度；
var winH = document.documentElement.clientHeight;
// 定义计时器；
var timer = null;
// 定义是否抵达顶部布尔值判断；
var isTop = true;
// 设置滚动事件；
window.onscroll = function(){
var toTop = document.body.scrollTop || document.documentElement.scrollTop;
// 判断是否到了第二屏，若是，显示按钮；
if (toTop >= winH) {
btn.style.display = 'block';
}else{
btn.style.display = 'none';
};
// 判断是否抵达顶部，若否，停止计时器；
if (!isTop) {
clearInterval(timer);
};
// 重置布尔值判断；
isTop = false;
}
// 设置按钮单击事件；
btn.onclick = function(){
// 设置计时器，50毫秒间隔；
timer = setInterval(function(){
var toTop = document.body.scrollTop || document.documentElement.scrollTop;
// 设置速度，用等式而不用具体数值是为了产生缓动效果；
var speed = Math.ceil(toTop/5);
// 作差，产生缓动效果；
document.documentElement.scrollTop = document.body.scrollTop = toTop - speed;
// 重置布尔值判断；
isTop = true;
// 判断是否抵达顶部，若是，停止计时器；
if (toTop == 0) {
clearInterval(timer);
};
},50);
}
}
</script>
</body>
</html>
相关推荐
简单的静态旅游网站，是用DreamWeaver做的。
【非常简单的静态网站】是一个专为介绍“有趣的鸡蛋”这一主题设计的简易网站。静态网站是基于HTML、CSS和JavaScript等基本技术构建的，不涉及服务器端编程，内容在用户请求时直接从服务器发送到浏览器，无需动态...
4. **响应式设计**：现代网站往往需要适应不同设备的屏幕大小，因此，这个简单的静态页面可能采用了响应式设计，通过媒体查询（`@media`规则）确保在手机、平板和桌面电脑上的显示效果良好。 5. **SEO优化**：为了...
标题 "一个很简单很简单的静态网页(附源代码）HTML+CSS.rar" 提示我们这是一个关于创建基础静态网页的教程，其中包含HTML和CSS的源代码。这个压缩包可能是一个教学资源，帮助初学者理解网页设计的基本概念。 描述中...
【标题】"最简单的静态网页.rar"所包含的是一个初学者级别的静态网页项目，这个项目主要运用了HTML5、CSS和JavaScript技术。HTML5是超文本标记语言的最新版本，它增强了网页的交互性和多媒体支持；CSS（层叠样式表）...
伪静态伪静态伪静态伪静态伪静态伪静态伪静态伪静态伪静态伪静态伪静态伪静态伪静态伪静态伪静态伪静态伪静态伪静态伪静态伪静态伪静态伪静态伪静态伪静态伪静态伪静态伪静态伪静态伪静态伪静态伪静态伪静态伪静态伪...
"简单的静态分页"项目，正如标题所言，是一个相对基础的实现，旨在提供一个易用且高效的分页解决方案。下面将详细阐述其关键知识点。 1. **分页原理**： 静态分页是通过在服务器端预先计算好每一页的数据，并将其...
一个简单的静态列表，以后还更新，动态列表和其他的关于C语言的东西
静态网站模板用div+css做的简单静态网站 这个是最近新的 下载地址：http://download.csdn.net/source/3461634 此为静态模板，含时间（农历）显示，二级下拉弹出菜单，幻灯片播放，栏目导航切换，视频播放，图片无缝...
这个名为"简单静态网页代码及资源"的压缩包，很可能是为了展示一个基础的静态网页示例，用于教学或者个人项目的快速启动。让我们详细探讨一下其中可能包含的知识点。 首先，"songsair"可能是一个个人或项目的名字，...
对静态页面最简单的一个示例介绍。展示了怎样建一个最简单的静态页面。并配有详尽注释。
标题“jquery超过一屏显示右下角返回顶部”所描述的是一个常见的网页交互功能，它利用jQuery库实现当页面滚动超过一整屏时，在页面右下角显示一个返回顶部的按钮，点击该按钮则平滑地滚动回页面顶部。这个功能在很多...
本文将以“简单的静态库调用实例”为出发点，深入讲解如何创建和使用静态库，并以`.lib`文件作为例子进行说明。 首先，我们要理解什么是静态库。静态库（.lib文件）是编译器在编译源代码时直接链接到目标程序中的库...
总之，制作一个简单的静态登录注册页面是前端开发入门的重要步骤，它能够帮助开发者熟练掌握HTML、CSS和JavaScript的基本语法和实际运用，提升对网页结构和交互逻辑的理解。虽然这个项目在实际应用中的价值可能有限...
在本项目中，我们关注的是一个名为"一个简单的静态网页作品"的压缩包，它包含了创建静态网页的基础过程，非常适合初学者学习。静态网页是指不包含服务器端脚本的网页，其内容在用户请求时直接从服务器发送到浏览器，...
本文将深入探讨IIS6的伪静态配置及其对静态文件处理的重要性。 伪静态技术是一种通过URL重写技术将动态网页的URL转换为静态或看似静态的URL形式，从而提高搜索引擎友好性和用户体验。对于IIS6来说，实现伪静态主要...
5. **缓存策略**：生成的静态页面会被缓存，当新的请求到来时，服务器首先检查是否有对应的静态页面，如果有，则直接返回，无需再次生成，提高了响应速度。 6. **动态与静态的切换**：在某些情况下，如内容频繁更新...
总之，“简单静态的网页”是一个基础的网页设计案例，它涉及到HTML、CSS和JavaScript的基本应用，以及可能的响应式设计和简单的交互功能。对于初学者而言，这是一个很好的起点，可以从中学习到网页制作的基本流程和...
综上所述，JSP简单静态网页涉及的技术点包括JSP的基本概念、语法结构、与静态网页的融合以及开发工具的使用，这些都是Web开发中重要的基础知识。通过学习这些内容，开发者可以更好地理解和实践动态网站的开发。
在本主题中，我们将深入探讨“静态网页-大学作业-简单的静态网页”这一概念，以及与之相关的知识点。静态网页是互联网上最早出现的网页类型，它们由HTML、CSS和可能的一些JavaScript等静态语言构建而成。这样的网页...