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

$(function () {
$("body").append($("<div id='totop'></div>"));
$("#totop").hide();
$(window).scroll(function () {
if ($(window).scrollTop() > ) {
$("#totop").fadeIn();
}
else {
$("#totop").fadeOut();
}
});
$("#totop").click(function () {
$('body,html').animate({ scrollTop: }, );
return false;
});
window.onload = function () {
$(window).scroll();
};
});

css:

/*回到顶部*/
#totop{
background:url(/themes/default/images/top_bg.png) no-repeat left top;
width:40px ;height:40px;
position:fixed;
left:%;bottom:%;
margin-left:605px;
}
#totop:hover{
background:url(/themes/default/images/top_bg.png) no-repeat left -40px;
cursor:pointer
}

jQuery返回顶部代码的更多相关文章

  1. JavaScript/Jquery返回顶部代码

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

  2. jQuery返回顶部代码组件

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

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

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

  4. qq空间返回顶部代码

    点击这里体验效果 以下是源代码: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "h ...

  5. jquery返回顶部,支持手机

    jquery返回顶部,支持手机 效果体验:http://hovertree.com/texiao/mobile/6/ 在pc上我们很容易就可以用scrollTop()来实现流程的向上滚动的返回到顶部的 ...

  6. jQuery返回顶部(精简版)

    jQuery返回顶部(精简版) <!DOCTYPE html><html lang="en"><head> <meta charset=& ...

  7. css 简单 返回顶部 代码及注释说明

    1. 最简单的静态返回顶部,点击直接跳转页面顶部,常见于固定放置在页面底部返回顶部功能 方法一:用命名锚点击返回到顶部预设的id为top的元素 html代码 <a href="#top ...

  8. jQuery返回顶部实用插件YesTop

    只需一句jQuery代码实现返回顶部效果体验:http://hovertree.com/texiao/yestop/ 使用方法:只需引用jQuery库和YesTop插件(jquery.yestop.j ...

  9. jquery 返回顶部 兼容web移动

    返回顶部图片 http://hovertree.com/texiao/mobile/6/tophovertree.gif 具体实现代码 <span id="tophovertree&q ...

随机推荐

  1. 【blockly教程】第三章Blockly顺序程序设计

    3.1 什么是Blockly语言  2012年6月,Google发布了完全可视化的编程语言Google Blockly,整个界面清晰明了, 你可以如同在玩拼图一样用一块块图形对象构建出应用程序.每个图 ...

  2. 毕业 迷茫 继续OR放弃?

    终于还是回学校拿了毕业证书,请了两个小时的假,连同中午吃饭的时间,顺利地从班主任手中拿到了毕业证书,大学就这样结束啦,人生也来到了一个新的转折点,但是每天的每天,我都是异常迷茫,异常胆怯,异常无语. ...

  3. 优步UBER司机全国各地奖励政策汇总 (2月15日-2月21日)

    滴快车单单2.5倍,注册地址:http://www.udache.com/ 如何注册Uber司机(全国版最新最详细注册流程)/月入2万/不用抢单:http://www.cnblogs.com/mfry ...

  4. 杭州优步uber司机第一组奖励政策

    -8月9日更新- 优步杭州第一组: 定义为激活时间在2015/6/8之前的车主(以优步后台数据显示为准) 滴滴快车单单2.5倍,注册地址:http://www.udache.com/如何注册Uber司 ...

  5. Ruby 基础教程1-4

    1.对象 数值对象 字符串对象 数组对象,散列对象 正则表达式对象 时间对象 文件对象 符号对象 2.类 Numeric String Array Hash Regexp File Symbol 3. ...

  6. coolshell里的一些c++文章

    c++数组不支持多态 https://coolshell.cn/articles/9543.htmlwhy gcc in c++ https://airs.com/ian/cxx-slides.pdf ...

  7. VS中添加新项 数据选项卡下没有ADO.NET实体数据模型解决方案

    第一种:C:\ProgramData下面搜索EFTools找到你vs对应版本的EFTools.msi 先remove 然后再Install 重启电脑再看 第二种:如果意外地删除了 Visual Stu ...

  8. bash脚本练习

    练习一: 1.添加5个用户,user1,...,user5: 2.每个用户的密码同用户名,添加密码完成后,不显示命令的执行结果: 3.每个用户添加完成后,都要显示用户某某已添加成功. useradd ...

  9. 换抵挡装置 (Kickdown,ACM/ICPC NEERC 2006,UVa1588

    题目描述:算法竞赛入门经典习题3-11 题目思路:1.两长条移动匹配 2.上下调换,取小者 #include <stdio.h> #include <string.h> int ...

  10. (转)GEM -次表面散射的实时近似

    次表面散射(Subsurface Scattering),简称SSS,或3S,是光射入非金属材质后在内部发生散射, 最后射出物体并进入视野中产生的现象, 即光从表面进入物体经过内部散射,然后又通过物体 ...