//CSS代码:
.backToTop {
display: none;
width: 18px;
line-height: 1.2;
padding: 5px 0;
background-color: #000;
color: #fff;
font-size: 12px;
text-align: center;
position: fixed;
_position: absolute;
right: 10px;
bottom: 100px;
_bottom: "auto";
cursor: pointer;
opacity: .6;
filter: Alpha(opacity=60);
}
// JS代码:
(function() {
var $backToTopTxt = "返回顶部", $backToTopEle = $('<div class="backToTop"></div>').appendTo($("body"))
.text($backToTopTxt).attr("title", $backToTopTxt).click(function() {
$("html, body").animate({ scrollTop: 0 }, 120);
}), $backToTopFun = function() {
var st = $(document).scrollTop(), winh = $(window).height();
(st > 0)? $backToTopEle.show(): $backToTopEle.hide();
//IE6下的定位
if (!window.XMLHttpRequest) {
$backToTopEle.css("top", st + winh - 166);
}
};
$(window).bind("scroll", $backToTopFun);
$(function() { $backToTopFun(); });
})();
分享到:
相关推荐
jquery返回顶部代码
本资源"图翼网侧边jQuery返回顶部代码.zip"提供了一个实用的jQuery特效,适用于网站的侧边栏,增强用户体验。下面我们将详细探讨这个特效涉及的jQuery知识点以及实现原理。 首先,jQuery的事件处理是关键部分。在这...
这个“简单实用jQuery返回顶部代码.zip”压缩包提供了一种利用jQuery实现这一功能的方法。jQuery是一个广泛使用的JavaScript库,它简化了JavaScript的DOM操作、事件处理以及动画效果。下面将详细讲解如何使用jQuery...
"蓝色jQuery返回顶部代码.zip"是一个包含实现这一功能的源码包,旨在为网页添加一个美观且实用的返回顶部按钮。这个按钮在用户向下滚动页面时会淡入显示,点击后页面将以平滑动画效果返回到顶部位置,提供了良好的...
腾讯网首页的jQuery返回顶部代码是实现网页交互效果的一种常见技术,它主要依赖于JavaScript库jQuery。这个代码示例主要用于提供一种便捷的方式,帮助用户在浏览长页面时快速回到页面顶部,提升用户体验。以下是对这...
**jQuery返回顶部功能详解** 在网页设计中,为了提高用户体验,常常会添加一个“返回顶部”的功能,使得用户在浏览长页面时能快速跳转到页面的顶部。本篇文章将详细解析如何使用jQuery实现这个功能,并确保其在各种...
<title>jQuery 返回顶部实例 <!-- 页面内容 --> ... <!-- 返回顶部按钮 --> 返回顶部">返回顶部"> <script src="jquery.1.4.2-min.js"> <script src="scrolltopcontrol.js"></script> ``` 接着,...
【描述】:“效果比较好的jQuery返回顶部代码”指的是利用jQuery的高效性能和丰富的API,编写出能够平滑、动态地显示和隐藏,并具有良好交互效果的“返回顶部”功能。这样的代码通常会结合CSS动画和JavaScript事件...
jQuery右端悬浮带返回顶部代码是一种常见的网页交互设计,它通常出现在页面滚动时,一个固定在屏幕右侧的小图标(如箭头或按钮)会显示出来,用户点击后页面会迅速滚动回顶部。这个功能可以提升用户体验,特别是对于...
本资源“jQuery平滑返回顶部代码.zip”提供了一种实现这一功能的方法,利用了广泛使用的JavaScript库jQuery。接下来,我们将深入探讨jQuery平滑返回顶部代码的工作原理、实现方式以及如何在实际项目中应用。 首先,...
本项目"猪八戒网jQuery返回顶部代码"利用了JavaScript库jQuery来实现这一功能,具体是基于jQuery 1.7.2的最小化版本(jquery-1.7.2.min.js)进行开发,提供了平滑的淡入淡出动画效果,提升了交互体验。 jQuery是一...
在这个特定的项目中,“jQuery右侧边栏二维码QQ客服返回顶部代码”是一个实现了一些常见网站功能的代码片段,包括: 1. **jQuery库的引入**:首先,你需要在网页中引入jQuery库,这通常是通过在HTML文档的`<head>`...
【jQuery返回顶部跟底部浮窗代码】是一种常见的网页交互元素,用于提高用户体验。在网页滚动时,用户可以方便地点击这个浮动窗口中的按钮,快速回到页面的顶部或底部。这种设计常见于长页面,比如博客文章、产品...
"jquery返回顶部隐藏按钮.rar"这个压缩包文件可能包含了实现这一功能的所有必要资源,包括HTML、CSS和JavaScript文件。其中,"jiaoben606"可能是项目的主要脚本文件或者示例代码文件。在实际应用中,这个文件可能...
**jQuery可变透明度返回顶部代码详解** 在网页设计中,提供一个返回顶部的功能是非常常见的需求,这可以方便用户在浏览长页面时快速回到页面顶部。"jQuery可变透明度返回顶部代码"就是一个实现此类功能的JavaScript...
在"jQuery绿色QQ在线客服返回顶部代码"中,`jQuery绿色QQ在线客服返回顶部代码`可能是实现这些功能的源代码文件,如JavaScript脚本和CSS样式表。文件"说明.htm"可能包含了具体的实现细节和使用说明,帮助开发者理解...