<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. Mybatis typeAliases别名

    <typeAliases> <typeAlias type="com.green.phonemanage.model.CellPhone" alias=" ...

  2. 一段高质量的SQL从问问题开始(笔记)

    首先SQL书写的目的是为了解决问题,因此只有明白了要解决的问题,才能写出更加高效的SQL语句,才能优雅的解决问题,获得更多的快乐! 在写一个SQL语句的时候不妨像优化器一样思考,问自己以下的这些问题, ...

  3. nginx 配置 ThinkPHP Rewrite

    server { listen 80; server_name www.funsion.com; root /www/web/funsion; index index.php; location / ...

  4. oracle分区表(整理)

    Oracle 表分区 早在8.0.5版本中,Oracle就将范围分区技术引入,现在分区功能已经越来越强大,包括支持扩展分区功能.Interval分区.外键分区.模拟列分区.以及分区建议器等.那么,分区 ...

  5. 在线演示平台 | Highcharts中文网 (曲线图、区域图、3D图等等)

    http://www.hcharts.cn/ 在线演示平台 | Highcharts中文网

  6. DSP280x的数模转换使用

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

  7. JSP动作学习一

    创建一个简单的模拟登陆功能的网页,没有用数据库技术,只是简单的学习jsp语法 首先创建一个登陆页面 <%@ page language = "java" import=&qu ...

  8. 设置浮点数的显示精度&precision(0)

    /*    设置浮点数的显示精度    cout.precision(int)可以设置浮点数的显示精度(不包括小数点)        注: 1.如果设置的精度大于浮点数的位数,如果浮点数能根据IEEE ...

  9. Java通过反射机制修改类中的私有属性的值

    首先创建一个类包含一个私有属性: class PrivateField{ private String username = "Jason"; } 通过反射机制修改username ...

  10. M1事后分析报告(Postmortem Report)

    M1事后分析报告(Postmortem Report) 设想和目标 1. 我们的软件要解决什么问题?是否定义得很清楚?是否对典型用户和典型场景有清晰的描述? 我们项目组所开发的软件为一个基于Andro ...