.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);
}
jQuery(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(); });
});
资源:http://www.zhangxinxu.com/study/201104/back-to-top-jquery.html?jdfwkey=da0132
分享到:
相关推荐
jquery返回顶部隐藏按钮
jquery返回顶部代码,底部小火箭样式,点击返回顶部
效果比较好的jQuery返回顶部代码
图翼网侧边jQuery返回顶部代码是一款鼠标经过二维码图标会显示微信二维码,点击指南图标会弹出自定义的弹出层,点击返回顶部图标会跳转到页面顶部。
div css3样式表制作jquery返回顶部特效
JQUERY返回顶部功能带微信二维码和新闻提示 JQUERY返回顶部功能带微信二维码和新闻提示
代码简介:jQuery返回顶部跟底部浮窗代码是一款带有上下箭头跟留言按钮的jQuery悬浮网页右侧中间浮动窗口特效代码。
js返回顶部/底部demo Jquery返回顶部/底部案例,html代码返回顶部以及返回顶部的案例
代码简介:扫微信二维码jQuery返回顶部是一款鼠标划过二维码图标会缩放弹出二维码图片,另外有意见反馈链接和返回网页顶部功能,效果实用,兼容主流浏览器。
jQuery可变透明度返回顶部代码,如果向下滚动超过1200像素,按钮的透明度会下降,减少视觉干扰,更便于浏览内容主体,非常贴心的用户体验,兼容主流浏览器。
代码简介:简单实用jQuery返回顶部代码是一款鼠标划过二维码图标会缩放弹出二维码图片,效果实用,代码简单。
实现效果: ... jquery返回顶部隐藏按钮 , 这个在商城网站用的是很多的,商品的信息很长,通过鼠标滚轮返回到顶部,那就out了,所以,商城的产品信息页面会有一个返回顶部的按钮!php中文网推荐下载!
Jquery返回顶部插件使用简单,步骤如下: 1、引用插件js和css文件 2、设置默认参数(showHeight :设置滚动高度时显示、speed :返回顶部的速度以毫秒为单位)
Jquery返回顶部 底部
木蚂蚁网站jQuery返回顶部是一款木蚂蚁官方网站的jQuery火箭返回顶部特效。
jquery返回顶部代码实例
Jquery返回顶部代码,兼容各种浏览器,使用简单。直接页面加链接。
当网页内容过多,导致页面过长时可以方便返回顶部