HTML:
<div id="goTop">
<a href="#top"><img src="~/Content/themes/base/images/ico_top.gif" alt="回到页首" title="回到页首 Top"></a>
</div>
CSS:
#goTop {
bottom: 15px;
margin: 0 auto;
position: fixed; //固定定位
margin-left: 945px;
} JS:
//当滚动条的位置处于距顶部100像素以下时,跳转链接出现,否则消失
$(function () {
$(window).scroll(function () {
if ($(window).scrollTop() > 100) {
$("#goTop").fadeIn(1500);
}
else {
$("#goTop").fadeOut(1500);
}
}); //当点击跳转链接后,回到页面顶部位置 $("#goTop").click(function () {
$('body,html').animate({ scrollTop: 0 }, 1000);
return false;
});
});

JS回到顶部代码小记的更多相关文章

  1. 兼容IE,chrome 等所有浏览器 回到顶部代码

    今天在博客园看到一片帖子回到顶部代码,索性就看了下,但是发现在非IE浏览器下可以运行,在IE浏览器下却运行不了. 故将其代码搬弄过来做了些许修改后,完美支持了IE下的运行. 主要实现功能代码文件: & ...

  2. 详解原生JS回到顶部

    第一次知道可以用超链接(锚点)实现回到顶部的时候我是很震惊的,想着原来可以这么简单啊!但是作为一个正在学习JS的小白,不能就这么轻易止步,所以查资料自己整了一个JS返回顶部. HTML代码: ? 1 ...

  3. js回到顶部------转载

    [1]锚点 使用锚点链接是一种简单的返回顶部的功能实现.该实现主要在页面顶部放置一个指定名称的锚点链接,然后在页面下方放置一个返回到该锚点的链接,用户点击该链接即可返回到该锚点所在的顶部位置 [注意] ...

  4. listView从底部回到顶部代码实现

    可用如下方法: 1.平滑的回到顶部,但是会划过中间的每一页 mListView.getRefreshableView().smoothScrollToPosition(0); 2.直接跳到顶部 if ...

  5. js回到顶部

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  6. 原生js回到顶部

    <!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8" ...

  7. css+js回到顶部

    .backToTop { display: none; width: 18px; line-height: 1.2; padding: 5px 0; background-color: #000; c ...

  8. jquery方法回到顶部代码

    <style> /*默认样式,主要是position:fixed实现屏幕绝对定位*/ #gotoTop{display:none;position:fixed;top:75%;left:5 ...

  9. js回到顶部 动画速度 (自己记录)

    x=x-20; 设置回到每10s的速度, function gotoTop(){ var x=document.body.scrollTop||document.documentElement.scr ...

随机推荐

  1. haskell io模块

    haskell中的io模块主要是用于读写文件屏幕的,通过import IO来导入 其中有如下常用定义 data IOMode = ReadMode | WriteMode | AppendMode | ...

  2. 【概念笔记】JavaEE - web part1

    IT`huhui前言录 想对学习的内容进行下简易的总结方便自己回头复习. 但是还有很多地方是不完善的需要慢慢修改. 持续更新. Web 服务器 IIS 微软主推 Apache C写的 Tomcat j ...

  3. JS,Jquery,ExtJs不同脚本动态创建DOM对象

    好久不来写东西了,这段时间太慢了,闲了下来看了几篇文章,觉得很好,同时也许咱们大家都能遇到,所以就把它记录下来... 简单使用JavaScript.JQuery.ExtJs进行DOM对象创建的测试,主 ...

  4. 淘宝TFS分布式文件系统内部实现

    TFS文件名的结构 TFS的文件名由块号和文件号通过某种对应关系组成,最大长度为18字节.文件名固定以T开始,第二字节为该集群的编号(可以在配置项中指定,取值范围 1~9).余下的字节由Block I ...

  5. C语言 数组 列优先 实现

    C语言数组结构列优先顺序存储的实现 (GCC编译). 从行优先转换为列优先存储方式, 与行优先相比, 不同之处在于改变了数组维界基址的先后顺序, 从而改变了映像函数常量基址. /** * @brief ...

  6. [游戏模版15] Win32 飞机射击

    >_<:Only give you the code,try to understand it! >_<:picture resource #include <windo ...

  7. [BTS] BizTalk host BizTalkServerApplication throttled because DatabaseSize exceeded the configured throttling limit.

    Log Name: ApplicationSource: BizTalk ServerDate: 7/22/2013 6:10:38 PMEvent ID: 7001Task Category: Bi ...

  8. atitit. applet 浏览器插件 控件 的环境,开发,提示总结o9o

    atitit. applet 浏览器插件 控件 的环境,开发,提示总结o9o 1. 建立applet:: 1 2. Applet 码 1 3. Applet (awt)跟japplet (swing) ...

  9. JavaScript简介及基础知识(1)

    1.JavaScript是什么—它是个脚本语言,需要宿主文件,它的宿主文件是html文件. Javascript是一种脚本语言,比HTML要复杂.不过即便你先前不懂编程,也不用担心,因为Javascr ...

  10. JAVA的安装与软件使用

    1.JAVA的安装与环境 2.练习: (1)初识java (2)使用eclipse输出自己的名字