js返回顶部小Demo
<style>
.divH {
height: 1800px;
}
.divT {
width: 50px;
height: 50px;
font-size: 18px;
background-color: #2F4F4F;
text-align: center;
color: white;
position: fixed;
right: 18px;
bottom: 18px;
}
.divT:hover{
cursor: pointer;
}
.hide {
display: none;
}
</style>
</head>
<body>
<div class="divH"></div>
<div class="divT hide" onclick="ReturnTop();"><strong>返回顶部</strong></div> <script src="./jq/jquery-1.9.1.min.js"></script>
<script>
window.onscroll = function () {
var current = $(window).scrollTop();
if (current > 180){
$(".divT").removeClass("hide");
}else {
$(".divT").addClass("hide");
}
}; function ReturnTop() {
$(window).scrollTop(0);
}
</script>
网页右下角有个返回顶部按钮,模仿淘宝?window.scrollTop()方法
js返回顶部小Demo的更多相关文章
- 添加“返回顶部”小图标按钮的JS(JavaScript)代码详解
如何给自己的网站添加方便快捷的"返回顶部"小图标按钮呢?如下图: JS源代码: /** * JavaScript脚本实现回到页面顶部示例 * @param acceleration ...
- js返回顶部封装 简洁
js返回顶部封装 简洁: 加入html页面body最后面即可. <script> a(); function a() { $(function() { if ($(".j-to- ...
- JS 带运动的返回顶部 小案例
带运动的返回顶部:当滚动条在滚动的时候,滚动鼠标的滚轮,应该让滚动条停止滚动,清掉定时器.下面的方法b 就是清掉的方法 <!DOCTYPE html PUBLIC "-//W3C//D ...
- 原生js返回顶部(匀速、由快到慢)
在项目中我们经常有需求要求页面滚动到一定位置时出现返回顶部按钮,点击即返回顶部. 方法一: 锚点,这是最简单的.(a标签的href属性等于一直要到达位置元素的id值) 方法二: js直接给页面根节点设 ...
- js返回顶部效果
当用户浏览的网页过于长的时候,用户在浏览到网页底部想要在返回顶部需要滚动好几次滚轮才能返回顶部,不仅麻烦,而且用户体验也会很差.现在的大多是页面都会在页面顶部或者是页面的可见区域的某一位置固定一个按钮 ...
- js返回顶部
1. function scrollTop(){ $(},); } 2. $("#side-bar .gotop").click(function(){ $(},); //返回顶部 ...
- 原生JS返回顶部,带返回效果
有些网站当滑到一定高度时右下角会有一个按钮,你只要一点就可以直接返回顶部了.那这个功能是怎么做到的呢.其实不算太难: 首先我们先在网页中创建一个按钮,上面写上返回顶部,把它的样式改成固定定位,之后想要 ...
- js 返回顶部
<script> window.onload = function(){ var oTop = document.getElementById("to_top"); v ...
- Asp.Net Mvc+Angular.Js自测小Demo
参考:http://www.cnblogs.com/eedc/p/6082052.html 一.引用anguler: 1.angular.js 2.angular-route.js 3.app.js ...
随机推荐
- 两个对象值相同(x.equals(y)==true),hashcode也相同
不对,如果两个对象x和y满足x.equals(y) == true,它们的哈希码(hash code)应当相同.Java对于eqauls方法和hashCode方法是这样规定的:(1)如果两个对象相同( ...
- BZOJ3398 牡牛和牝牛
隔板搞掉就行了 特么我什么时候感冒能好!QAQ.脑子都没有了QAQ. //Love and Freedom. #include<cstdio> #include<cstring> ...
- LOJ6437 PKUSC2018 PKUSC
带劲的计算几何[这一定是我WC之前开的最后一道计几!!! 每个点画个圆然后看一下交点 然后判断是多边形内还是多边形外 这个就是取圆上中点然后射线法 eps我1e-8才过 不知道为啥有的人说只能开1e- ...
- Linux网络栈
原创转载请注明出处:https://www.cnblogs.com/agilestyle/p/11394930.html OSI模型 OSI 模型把网络互联的框架分为应用层.表示层.会话层.传输层.网 ...
- 回顾Servlet及SpringMVC
什么是Servlet? Servlet是运行在Web服务器或应用服务器上的程序,它是作为来自Web浏览器或其他HTTP客户端的请求和HTTP服务器上的数据库 或应用程序之间的中间层. servlet架 ...
- 分别在javascript和JSP中动态设置下拉列表默认值
一.JavaScript中动态设置select标签中<option>选项的默认值: 比如,要完成下边这个下拉列表的动态显示,并且当进行前后翻页时,下拉列表中的值自动更新为当前页码: 图1 ...
- Tomcat 中get请求中含有中文字符时乱码的处理
Tomcat 中get请求中含有中文字符时乱码的处理
- springMVC带参数请求重定向
SpirngMVC返回逻辑视图名 可以分下面几种情况: 1. servlet进行请求转发,返回到jsp页面,如 return "index.jsp" ; 2. servlet 返 ...
- Spring Boot学习一之配置类及自动配置
一.配置类 1. 导入其他配置类 你不需要将所有的 @Configuration 放进一个单独的类, @Import 注解可以用来导入其他配置类.另外,你也可以使用 @ComponentScan 注解 ...
- 左手Mongodb右手Redis 通过python连接mongodb
首先需要安装第三方包pymongo pip install pymongodb """ 通过python连接mongodb数据库 首先需要初始化数据库连接 "& ...