一个简单的返回顶部jQuery代码

本文演示jQuery返回顶部,当文章页比较长时间,可以方便用户返回网站的顶部,实现代码也不难,大家学习下!

jQuery返回顶部

调用代码:

<script language="javascript" type="text/javascript" src="jquery-1.4.2.min.js"></script>
<script language="javascript" type="text/javascript" src="scrollSilde.js"></script>
<script language="javascript" type="text/javascript" >
    $(function () {
        $(window).gotoTop({
            showHeight: 150, //设置滚动高度时显示
            speed: 200 //返回顶部的速度以毫秒为单位
        });
    });
</script>

其中scrollSilde.js代码为:

//返回顶部

$(function () {
    $.fn.gotoTop = function (options) {
        var defaults = {
            showHeight: 150,
            speed: 1000
        };
        var options = $.extend(defaults, options);
        $(document.body).prepend("<div id='totop'><a></a><p></p></div>");
        var $toTop = $(this);
        var $top = $("#totop");
        var $ta = $("#totop a");
        var $bt = $("#totop p");
        $toTop.scroll(function () {
            var scrolltop = $(this).scrollTop();
            if (scrolltop >= options.showHeight) {
                $top.show();
            }
            else {
                $top.hide();
            }
        });
        $ta.click(function () {
            $("html,body").animate({ scrollTop: 0 }, options.speed);
        });
        $bt.click(function () {
            $("#mess").show();
        });
    }
}); 
时间: 2024-11-05 22:07:07

一个简单的返回顶部jQuery代码的相关文章

手机端网页返回顶部js代码

<!DOCTYPE html>  <html>  <head>  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />  <title>手机端网页返回顶部js代码</title>  <script src="http://libs.baidu.com/jquery/1.11.3/jquery.m

对一个简单的时间片轮转多道程序内核代码的浅析

这周在网易云课堂上学习了<Linux内核分析>——操作系统是如何工作的.本周学习内容有利用 mykernel 实验模拟计算机平台和利用 mykernel 实验模拟计算机硬件平台两部分内容. 这是实验楼中 mykernel 平台运行的结果: 下面是一段一个简单的时间片轮转多道程序内核代码: 1 /* 2 * linux/mykernel/myinterrupt.c 3 * 4 * Kernel internal my_timer_handler 5 * 6 * Copyright (C) 201

Linux内核分析—完成一个简单的时间片轮转多道程序内核代码

---恢复内容开始--- 20135125陈智威 原创作品转载请注明出处 <Linux内核分析>MOOC课程http://mooc.study.163.com/course/USTC-1000029000 ” 实验要求: mykernel实验指导(操作系统是如何工作的) 运行并分析一个精简的操作系统内核,理解操作系统是如何工作的 使用实验楼的虚拟机打开shell cd LinuxKernel/linux-3.9.4 qemu -kernel arch/x86/boot/bzImage 然后cd

弹性返回顶部JS代码

弹性返回顶部JS代码 弹性返回顶部JS代码点击下载

完成一个简单的时间片轮转多道程序内核代码(二)

完成一个简单的时间片轮转多道程序内核代码 重要汇编代码分析 asm volatile( "movl %1,%%esp\n\t" "pushl %1\n\t" "pushl %0\n\t" "ret\n\t" "popl %%ebp\n\t" : : "c" (task[pid].thread.ip),"d" (task[pid].thread.sp) ); 保存恢复进

简单的返回顶部代码

1. 最简单的静态返回顶部,点击直接跳转页面顶部,常见于固定放置在页面底部返回顶部功能 方法一:用命名锚点击返回到顶部预设的id为top的元素 <a href="#top" target="_self">返回顶部</a>方法二:操作scrooll函数用来控制滚动条的位置(第一个参数是水平位置,第二个参数是垂直位置) <a href="javascript:scroll(0,0)">返回顶部</a> 

完成一个简单的时间片轮转多道程序内核代码

王康 + 原创作品转载请注明出处 + <Linux内核分析>MOOC课程http://mooc.study.163.com/course/USTC-1000029000 " 分别是1 存储程序计算机工作模型,cpu执行程序的基础流程: 2 函数调用堆栈:各种寄存器和存储主要是为了指令的传取值,通过eip,esp,eax,ebp和程序内存的分区,搭配push pop call return leave等一系列指令完成函数调用操作. 3 中断:多道批程序! 在复习一下上一讲的几个重要指令

第二周:一个简单的时间片轮转多道程序内核代码及分析

吕松鸿+ 原创作品转载请注明出处 + <Linux内核分析>MOOC课程http://mooc.study.163.com/course/USTC-1000029000 一.函数调用堆栈 1. 计算机工作的三个法宝 存储程序计算机工作模型,计算机系统最最基础性的逻辑结构: 函数调用堆栈,高级语言得以运行的基础,只有机器语言和汇编语言的时候堆栈机制对于计算机来说并不那么重要,但有了高级语言及函数,堆栈成为了计算机的基础功能: enter pushl %ebp movl %esp,%ebp lea

网页内容实现太长实现返回顶部的代码

1. <a id="gotopbtn" style="position:fixed;width:12px;bottom:45px;right:150px;display:none;cursor:pointer;">返回顶部</a> <script> var backTop = function(btnId){ var btn = document.getElementById(btnId); var d = document.do