jqury点击返回顶部代码
效果请看右下角:代码如下:
<div class="totop">
<img src="https://www.cnblogs.com/images/cnblogs_com/aiwuxia/1249780/o_replay_tophover.jpg" alt="">
</div>
<script>
var topMain=$(".head").height()
$(window).scroll(function(){
if ($(window).scrollTop()>topMain){
$(".totop").slideDown(500);
}
else{
$(".totop").slideUp(500);
}
});
$(".totop").click(function(){$("body,html").animate({scrollTop:0},500)});
</script>
jqury点击返回顶部代码的更多相关文章
- qq空间返回顶部代码
点击这里体验效果 以下是源代码: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "h ...
- css 简单 返回顶部 代码及注释说明
1. 最简单的静态返回顶部,点击直接跳转页面顶部,常见于固定放置在页面底部返回顶部功能 方法一:用命名锚点击返回到顶部预设的id为top的元素 html代码 <a href="#top ...
- vue点击返回顶部插件vue-totop
vue-totop vue 点击返回顶部插件,可以根据参数设定按钮大小,颜色,类型,返回顶部的时间等.github地址:https://github.com/1006008051/vue-totop, ...
- jQuery火箭图标返回顶部代码
在网上找来段使用jQuery火箭图标返回顶部代码,感觉比较酷,比较炫,大概样式如下, 代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1. ...
- jQuery-点击返回顶部
在页面上,有时需要点击某个图标钮实现返回顶部的效果. 实现方式如下,给图标按钮增加名叫goTop-hook的类. // 点击返回顶部 $(window).scroll(function() { if ...
- js中点击返回顶部
window.scrollTo(0, 0);当点击返回顶部的时候调用这个方法即可 handleScrollTop(){ window.scrollTo(0, 0); }
- [html][转]常用返回顶部代码
转至:http://jingyan.baidu.com/article/7082dc1ca6b928e40a89bd1a.html 一.使用HTML的锚标记最简单了 但是唯一的缺点就是样式不怎么样,会 ...
- 在页面中有overflow-y:auto属性的div,当出现滚动条,点击返回顶部按钮,内容回这个div最顶部
<!doctype html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- jQ 移动端返回顶部代码整理
//返回顶部 $('#btn-scroll').on('touchend',function(){ var T = $(window).scrollTop(); var t = setInterval ...
随机推荐
- 51nod1153(dfs/单调队列)
题目链接:https://www.51nod.com/onlineJudge/questionCode.html#!problemId=1153 题意:中文题诶- 思路:一个比较简单的方法是dfs隐式 ...
- codevs 3333 高级打字机
3333 高级打字机 题目描述 Description 早苗入手了最新的高级打字机.最新款自然有着与以往不同的功能,那就是它具备撤销功能,厉害吧. 请为这种高级打字机设计一个程序,支持如下3种操作 ...
- SWT的基本组件使用
1按钮组件(Button) (1)Button组件常用样式 SWT.PUSH按钮 SWT.CHECK多选按钮 SWT.RADIO单选按钮 SWT.ARROW箭头按钮 SWT.NONE默认按钮 SWT. ...
- STP-9-处理RSTP中的拓扑变化
STP能识别四种不同的拓扑变化事件, 而RSTP只有当非边界端口从非转发状态变为转发状态才认为发生了拓扑变化事件 因为刚变为转发状态的端口可以为一些mac地址提供比之前更好的路径,CAM表需要更新.失 ...
- VUE中模块与组件
组件:我们项目中,每一个资源(.js,.css,.vue,...)都是一个模块,这些模块是相互独立,但是我们可以通过类似于webpack构建工具把它们整合在一起,你可以理解为模块就是一个一个积木,通过 ...
- STM32之VCP1/VCAP2引脚的处理
需要根据仔细根据手册来决定这两个引脚是直接接地还是电容下拉到地 转载:STM32的Vcap的问题及解决---原来经验也害人http://bbs.eeworld.com.cn/thread-499497 ...
- Could not load file or assembly 'Oracle.ManagedDataAccessDTC.DLL' or one of its dependencies.
Could not load file or assembly 'Oracle.ManagedDataAccessDTC.DLL' or one of its dependencies. 不是有效的 ...
- 仙人掌(cactus)
题目描述LYK 在冲刺清华集训(THUSC)!于是它开始研究仙人掌,它想来和你一起分享它最近研究的结果.如果在一个无向连通图中任意一条边至多属于一个简单环(简单环的定义为每个点至多经过一次),且不存 ...
- WinForm 开发框架 Jade UI Beta
Jade UI Demo Beta 个人网站:http://www.2to.net 开源地址:https://github.com/dcdlove/JadeUI 预览DEMO下载: http://pa ...
- 第十七章 提升用户体验 之 使用MVC扩展功能控制程序行为
1. 概述 ASP.NET MVC具有很好的扩展性,每一个核心功能都可以被扩展.重写 和 定制. 本章内容包括:实现MVC过滤器和controller工厂.使用 action results,view ...