基于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").animate({                           scrollTop: 0                      },  
                    120)                   }),  
                c = null;                   a(window).bind("scroll",                   function() {  
                    var d = a(document).scrollTop(),  
                    e = a(window).height();  
                    0 < d ? b.css("bottom", "200px") : b.css("bottom", "-200px");                       a.isIE6() && (b.hide(), clearTimeout(c), c = setTimeout(function() {  
                        b.show();  
                        clearTimeout(c)  
                    },  
                    1E3), b.css("top", d + e - 125))                   })  
            }  
        }  
 
    })  
})  
 
(jQuery); (function(a) {  
 
    a("body")('<a class="close" href="javascript:;"></a>');    
})  
 
(function() {  
 
    $("#returnTop").returntop()   });  

实例

 代码如下 复制代码

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>360导航返回顶部特效代码</title>
<link href="css/top.css" rel="stylesheet"  type="text/css"/>
</head>

<body style="text-align:center; height:1000px">
</head>

<a id="returnTop" href="javascript:;">回到顶部</a>
<script src="js/jquery-1.6.4.min.js" type="text/javascript"></script>
<script src="js/top.js" type="text/javascript"></script>

<p>
    <script language="javascript">
for(i=0;i<50;i++){
 document.write(i+"<br />");
}
  </script>
</body>
</html>

友情提醒

jquery代码各位同学可以自己到官方下载最新版本的，这里只提供返回顶部代码，我们把top.js保存然后再调用即可实现。

时间： 2024-10-02 13:17:57

基于jquery 360导航返回顶部代码的相关文章

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

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

基于jquery平滑滚动“返回顶部”效果

 代码如下 复制代码 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>点击平滑滚动&quo

基于jQuery弹性滑动导航菜单效果代码

HTML代码如下:  代码如下 复制代码 <DIV id=nav> <DIV class=nav-menu> <A class=current href="#">首页</A> <A href="#">关于Camnpr</A> <A href="#">案例展示</A> <A href="#">联系方式</A>&

基于jQuery浮动导航菜单特效代码

效果如图所示 部份代码整理  代码如下 复制代码 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"  "http://www.w3.org/TR/html4/strict.dtd"> <html lang="en"> <head>  <meta http-equiv="Content-Type" content="text/h

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

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

基于jquery实现导航菜单高亮显示（两种方法）_javascript技巧

项目需求: 实现原理:当选中当前元素时,给当前元素添加样式,同级元素移除样式. 点击不同的导航菜单实现当前点击的菜单是高亮的,点击导航下面的某个分类,分类所属的导航也必须是高亮的,点击某一篇文章,文章所属的导航菜单也必须是高亮的. 效果图如下: 示例代码一: 具体示例代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/x

jquery返回顶部代码

分享一个jquery在返回顶部在代码:不依赖CSS $("body").append(" ∧   ");   var totop=$("#toTop"); totop.bind({ click:function(){ $("html,body").animate({scrollTop:0},500) }, mouseover:function(){ $("#toTopTips").stop(false,tr

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

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

网页点击按钮返回顶部代码

使用HTML的锚标记最简单了,但是唯一的缺点就是样式不怎么样,会显示这个锚标记. <a name="top" id="top"></a> 放置位置在<body>标签之后随便找个地方放都可以,只要靠近顶部即可. 页面底部放置: <a href="#top" target="_self">返回顶部</a> 使用Javascript Scroll函数返回顶部 使用Javas