一句jQuery代码返回顶部

一句jQuery代码返回顶部效果体验:http://hovertree.com/texiao/yestop/使用方法:只需引用jQuery库和YesTop插件,然后一句代码就可以实现返回顶部:引用代码

大家好,又见面了,我是全栈君,今天给大家准备了Idea注册码。

全栈程序员社区此处内容已经被作者隐藏,请输入验证码查看内容
验证码:
请关注本站微信公众号,回复“验证码”,获取验证码。在微信里搜索“全栈程序员社区”或者“www_javaforall_cn”或者微信扫描右侧二维码都可以关注本站微信公众号。

一句jQuery代码返回顶部

效果体验:

http://hovertree.com/texiao/yestop/

使用方法:

只需引用jQuery库和YesTop插件,然后一句代码就可以实现返回顶部:

引用代码:
<script type="text/javascript" src="http://hovertree.com/ziyuan/jquery/jquery-1.11.3.min.js"></script>
<script type="text/javascript" src="http://hovertree.com/texiao/yestop/inc/jquery.yestop.js"></script>

使用代码:
<script type="text/javascript">
     $(document).ready(function () { $.fn.yestop(); })
</script>
也就是:
$.fn.yestop();

这句代码就可以了。
当然还有高级的设置,如换图片,设置图标为圆形,设置位置,设置时间等等。详情请查看其他Demo。
完整代码,保存到HTML文件就可以体验效果:
<!DOCTYPE html>
<html>
<head><meta charset="UTF-8">
    <title>YesTop - HoverTree</title><meta name="viewport" content="width=device-width, initial-scale=1.0">
    <script type="text/javascript" src="http://hovertree.com/ziyuan/jquery/jquery-1.11.3.min.js"></script>
    <script type="text/javascript" src="http://hovertree.com/texiao/yestop/inc/jquery.yestop.js"></script>
    <style>
        body {
            margin: 0px;font-family:Arial
        }a{color:blue}
    </style>
</head>
<body>
    <div style="text-align:center;width:100%;margin:0px auto;">
        <h1>YesTop</h1>
        A jQuery Plugin<br />
        <a href="http://hovertree.com/texiao/yestop/">Demo 1</a> <a href="http://hovertree.com/texiao/yestop/demo2.htm">Demo 2</a> <a href="http://hovertree.com/texiao/yestop/demo3.htm">Demo 3</a>
        <a href="http://hovertree.com/texiao/yestop/demo4.htm">Demo 4</a> <a href="http://hovertree.com/h/bjaf/topimage.htm">Images</a>
    </div>
    <div style="height: 360px;background-color: #66FF66;">
       
    </div>
    <div style="width:100%;text-align:center;height:200px">&copy; hovertree.com</div>    
    <div style="height: 200px; visibility: visible; background-color: Olive">
    </div><div style="height:200px;background-color:burlywood"></div><div style="height:200px;background-color:darkorchid"></div>
    <div style="height: 200px; visibility: visible; background-color:gray">
    </div>
    <div style="height:200px;background-color:blue"></div>
    <div style="height:200px;background-color:red"></div>
    <div style="height:200px;background-color:yellow"></div>
    <div style="height:200px;background-color:yellowgreen"></div>
    <div style="height:800px;background-color:white"></div>
    <script type="text/javascript">
        $(document).ready(function () { $.fn.yestop(); })
    </script>
</body>
</html>

更多:http://www.cnblogs.com/roucheng/p/texiao.html

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请联系我们举报,一经查实,本站将立刻删除。

发布者:全栈程序员-站长,转载请注明出处:https://javaforall.net/120678.html原文链接:https://javaforall.net

(0)
上一篇 2021年12月21日 下午6:00
下一篇 2021年12月21日 下午7:00


相关推荐

  • 密码加密方式

    密码加密方式密码加密方式

    2022年4月22日
    81
  • 【理论恒叨】【立体匹配系列】经典SGM:(1)匹配代价计算之互信息(MI)

    【理论恒叨】【立体匹配系列】经典SGM:(1)匹配代价计算之互信息(MI)SemiGlobalMa SGM 立体匹配经典算法 理论详解教学

    2026年1月16日
    1
  • 卸载52好压,极速输入法,手机模拟大师这些流氓软件[通俗易懂]

    卸载52好压,极速输入法,手机模拟大师这些流氓软件[通俗易懂]卸载52好压,极速输入法的方法:通过控制面板里卸载了之后发现这两个流氓软件居然还在?于是换了一种卸载方法:先在官网下载并重新安装这两个软件,如果电脑已经安装了旧版本会提示安装的新版本会覆盖旧的版本,然后通过腾讯电脑管家卸载卸载手机模拟大师:在D盘找到LDSGameMaster,在文件夹里找到uninst,双击后卸载不要直接删除手机模拟大师的文件!如果直接删除文件到最后会发现有一个文件死活删不了,要通过卸载才能删除干净…

    2022年6月8日
    143
  • sublime 4 202107 激活码(注册激活)

    (sublime 4 202107 激活码)2021最新分享一个能用的的激活码出来,希望能帮到需要激活的朋友。目前这个是能用的,但是用的人多了之后也会失效,会不定时更新的,大家持续关注此网站~IntelliJ2021最新激活注册码,破解教程可免费永久激活,亲测有效,下面是详细链接哦~https://javaforall.net/100143.html…

    2022年3月20日
    48
  • 微信聊天记录迁移(Android到IOS)「建议收藏」

    微信聊天记录迁移1.原设备登录微信我的–>设置–>通用–>聊天记录备份与迁移选择“迁移聊天记录到另一台设备”选择“迁移全部聊天记录”,会生成一个二维码用新的设备登录该微信号并扫描此二维码,即可迁移数据…

    2022年4月15日
    216
  • jsessionid是什么意思(请求头jsessionid)

    (1)这是一个保险措施因为Session默认是需要Cookie支持的但有些客户浏览器是关闭Cookie的这个时候就需要在URL中指定服务器上的session标识,也就是5F4771183629C9834F8382E23BE13C4C用一个方法(忘了方法的名字)处理URL串就可以得到这个东西这个方法会判断你的浏览器是否开启了Cookie,如果他认为应该加他就会加上去(2)

    2022年4月14日
    143

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

关注全栈程序员社区公众号