<script src="http://ajax.microsoft.com/ajax/jQuery/jquery-1.7.2.min.js"></script>
<script>
$(function(){
//当滚动条的位置处于距顶部100像素以下时,跳转链接出现,否则消失
$(function () {
$(window).scroll(function(){
if ($(window).scrollTop()>100){
$("#back-to-top").fadeIn(1500);
}
else
{
$("#back-to-top").fadeOut(1500);
}
});
//当点击跳转链接后,回到页面顶部位置
$("#back-to-top").click(function(){
$('body,html').animate(
{scrollTop:0//$("#mai").offset().top+"px"
},1000);
return false;
});
});
});
</script>

  

Jquery---用jQuery实现的智能隐藏、滑动效果的返回顶部代码的更多相关文章

  1. jQuery火箭图标返回顶部代码

    在网上找来段使用jQuery火箭图标返回顶部代码,感觉比较酷,比较炫,大概样式如下, 代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1. ...

  2. jQuery返回顶部代码组件

    非原创,拿来修改,样式可自定义,div,img都可以,效果如下: 下载地址:http://files.cnblogs.com/files/EasonJim/jquery.topback.rar 项目相 ...

  3. 用Jquery写返回顶部代码

    <!DOCTYPE html><html><head><meta charset="utf-8" /><title>jq ...

  4. jQuery返回顶部代码

    页面较长时,使用返回顶部按钮比较方便,在电商中必备操作.下面自己制作一个js文件,totop.js,把它直接引用到需要的网页中即可. $(function () { $("body" ...

  5. JavaScript/Jquery返回顶部代码

    <!DOCTYPE html> <html> <head> <title>返回顶部</title> <meta charset=&qu ...

  6. jquery 如何实现回顶部 带滑动效果

    $("#returnTop").click(function () { var speed=200;//滑动的速度 $('body,html').animate({ scrollT ...

  7. 简约的返回顶部效果(jQuery)

    博客建好也快一个月了,主题是在原有主题的基础上做的修改,喜欢这样的清新简约风格,为了更好的体验,以后也会经常做修改. 一般博客的文章都比较长,看到下面不能快速返回到顶部还真是不方便,今天自己动手写了一 ...

  8. jquery的slideUp、slideDown、slideToggle等涉及滑动效果的一系列函数,在IE浏览器下有几处bug

    jquery的slideUp.slideDown.slideToggle等涉及滑动效果的一系列函数,在IE浏览器下有几处bug: 1. 因position引起的问题 影响:IE全系列 症状:在需要sl ...

  9. js进阶 13-2 jquery动画滑动效果哪些注意事项

    js进阶 13-2 jquery动画滑动效果哪些注意事项 一.总结 一句话总结:滑动里面这里up是隐藏,down是显示. 1.jquery动画默认的两个切换效果是什么(swing默认和linear的区 ...

随机推荐

  1. Mysql账号管理

    一 用户添加 通过insert 方式添加用户 insert into mysql.user(Host,User,Password) values("localhost"," ...

  2. 一步一步实现Linux设备驱动的Helloworld模块

    学了那么多程序语言,总是有一个Hello world开头,不禁感叹Hello world的强大.呵呵,废话少说,咋们的故事当然要从这个Hello world开始. 先查看自己OS使用的内核版本[don ...

  3. golang的内存模型与new()与make()

    要彻底理解new()与make()的区别, 最好从内存模型入手. golang属于c family, 而c程序在unix的内在模型: |低地址|text|data|bss|heap-->|unu ...

  4. maven学习手记 - 3

    学习目标 maven插件的定义: maven插件的使用.   前言 在手记2中说过maven的阶段命令是通过插件实现的.在手记1中也有简单的示范过插件的用法.但是总觉得有些泛泛了,想在这里再捋一下,以 ...

  5. [转]IIS部署托管管道模式的集成和经典区别

    关于ESPS和SCSJ在Windows server 2008的问题总结 SCSJ出现的问题在于集成模式和经典模式的选择上,系统本身是没有问题的.我们在部署系统的时候,选择了集成模式,导致WebCon ...

  6. C#取枚举描述

    一直都觉得枚举是个很不错的东西,可以给我们带来很多方便,而且也增加代码的可读性. 我在之前已经介绍过枚举的简要应用了,再次再来写下怎么获取枚举的描述. 源码如下: 首先,我们定义个含有描述的枚举类型 ...

  7. DSP280x的数模转换使用

    /*****************************************************************************Copyright: 2013File na ...

  8. [无人值守安装操作系统]__RHEL6__FTP+TFTP+DHCP+Kickstart+PXE

    实验环境 1.实验平台:VMware Workstation 10 2.实验OS:RHEL6 3.服务器A: (1) 10.0.10.158 (2) DHCP/FTP/TFTP (3) 有可使用的yu ...

  9. How to compile and install NCAR Command Language on IBM PowerPC 64 --- NCL编译安装步骤

    作者:Sinsonglew 出处:http://www.cnblogs.com/sinsonglew 欢迎转载,也请保留这段声明.thanks :) 注记:NCL官方依赖安装包全集列表.官方源码编译指 ...

  10. java无符号移位(>>>)和有符号移位(>>)

    java中>>(<<)表示有符号的移位.<<<(>>>)表示无符号移位 如: int num = 22; 二进制是0001 0110, nu ...