jquery返回顶部代码

  分享一个jquery在返回顶部在代码:不依赖CSS

  $("body").append("


 

");

 

  var totop=$("#toTop");

  totop.bind({

  click:function(){

  $("html,body").animate({scrollTop:0},500)

  },

  mouseover:function(){

  $("#toTopTips").stop(false,true).fadeIn()

  $(this).css({"background-color":"#51B9FF"})

  },

  mouseout:function(){

  $("#toTopTips").css("display","none")

  $(this).css({"background-color":"#09F"})

  }

  })

  $(window).scroll(function(){

  if($.browser.msie && ($.browser.version == "6.0") && !$.support.style){//如果IE6

  totop.css({"top":($(window).scrollTop()+$(window).height()-100)+"px","position":"absolute"});

  }

  if($(window).scrollTop()<=50){

  totop.fadeOut();

  }else{

  totop.fadeIn();

  }

  });

时间: 2024-07-28 19:08:50

jquery返回顶部代码的相关文章

用jQuery实现的智能隐藏、滑动效果的返回顶部代码

 这篇文章主要介绍了用jQuery实现的智能隐藏.带滑动效果的返回顶部代码,非常实用,需要的朋友可以参考下     在线DEMO:传送门   HTML代码(放在页面任意位置,并用CSS美化):    代码如下:<p id="back-to-top"><a href="#top"><span></span>回到顶部</a></p>   JS代码:    代码如下: <script type=

基于jquery 返回顶部按钮效果代码

在 IE6 中, 因为不支持浏览器跟随功能, 所以通过跟随页面滚动来虚拟跟随效果, 在滚动页面的时候隐藏回到顶部按钮, 滚动停止时再显示按钮. 参数描述 pageWidth: 页面宽度 (正整数), 如图中 A 所示. nodeId: 回到顶部按钮的 ID (字符串). nodeWidth: 回到顶部按钮的宽度 (正整数), 如图中 B 所示. distanceToBottom: 回到顶部按钮到页面底部的距离 (正整数), 如图中 C 所示. hideRegionHeight: 不显示回到顶部按

基于jquery 360导航返回顶部代码

top.js代码  代码如下 复制代码 var IMYUAN;   IMYUAN || (IMYUAN = {});     (function(a) {         a.fn.extend({           returntop: function() {               if (this[0]) {                   var b = this.click(function() {                       a("html, body&q

收藏了三jQuery返回顶部特效代码

 代码如下 复制代码 <title>jQuery返回顶部特效 </title> </head> <body> <style type="text/css"> /*返回顶部*/ #roll_top {position:relative; margin-bottom:1px;cursor:pointer;height:60px;width:60px;display:block;background:#ddd;} #roll_top

jquery小火箭返回顶部代码分享_jquery

这是一款基于jquery小火箭返回顶部特效源码,解决了页面太长造成的用户返回页面顶端困难. 为大家分享的jquery小火箭返回顶部代码如下 <head> <title>jquery小火箭返回顶部代码</title> <link href="css/top.css" rel="stylesheet" type="text/css"/> </head> <body style=&quo

jquery返回顶部实现方法

本文章主要讲关于jquery返回顶部实现方法,下面看代码吧. html  代码如下: <div class="scroll"></div> <script type="text/网页特效" src="../skins/css教程/jquery.js" charset="utf-8"></script> <script type="text/javascript&q

jquery 返回顶部、图片比例缩小、验证元素是否存在

jquery 返回顶部.图片比例缩小.验证元素是否存在 返回顶部代码 $(document).ready(function() {   $('a[href*=#]').click(function() {    if (location.pathname.replace(/^//,'') == this.pathname.replace(/^//,'')        && location.hostname == this.hostname) {      var $target = $

jquery 返回顶部浮动图标实现代码

代码使用很简单,只需要将HTML代码,和jQuery代码放入到网页的尾部即可.另外你可能还需要和我一样盗用人人网的返回顶部图片一张. HTML代码 <div style="display:none;" class="back-to" id="toolBackTop"> <a title="返回顶部" onclick="window.scrollTo(0,0);return false;"

网页中返回顶部代码(多种方法)另附注释说明_jquery

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