jquery js top 按钮

最新推荐文章于 2022-12-15 09:51:32 发布

carson

最新推荐文章于 2022-12-15 09:51:32 发布

阅读量925

点赞数

分类专栏： js 文章标签： jquery function border timer xhtml class

本文链接：https://blog.csdn.net/a454213722/article/details/6972419

版权

js 专栏收录该内容

4 篇文章 0 订阅

订阅专栏

网页页要放一个top按钮
方法一在我的网页里加载jquery的时候就有问题，还没找到原因
所有又搞了一个方法二在IE6有点问题
方法一、
先要加载jquery
html测试

<!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=utf-8" />
<title>无标题文档</title>
<script src="jquery-1.6.js"></script>
<script src="core.js"></script>
</head>

<body style=" text-align:center">
<div style=" height:1680px; margin:0 auto; background:#F00; width:950px; position: relative" id="banggood">
<div style=" height:200px; width:100%; background:#0CC"></div>
<a class="topBar" href="#top" style="position: absolute; right: 50px; padding: 2px 1px; border: 1px solid rgb(204, 204, 204); font-weight: bold; color: rgb(204, 0, 0); display: block; top: 1680px;">Top</a>
</div>
</body>
</html>

jquery 代码

$(function(){

var topBar='<a class="topBar" style="position:absolute;right:50px;padding:2px 1px;border:1px solid #ccc;font-weight:bold;color:#c00;" href="#top">Top</a>';
$('#banggood').append(topBar);
var topBar=$('a.topBar');
topBar.click(function(){
	window.scrollTo(0,0);return false;
	}).hide();
	$(window).scroll(function(){
		if($(window).scrollTop()>$(window).height()/2)
		{
			var topBar_top=$(window).scrollTop()+$(window).height()-60+"px";
			if(topBar.is(':hidden'))
			{
				topBar.css('top',topBar_top);topBar.fadeIn(1000);
			}
			else
			{
				topBar.animate({top:topBar_top},{duration:600,queue:false});
			}
		}
		else
		{
					topBar.hide();
		
		}
	});


});

方法二

lastScrollY=0;
function heartBeat(){
var diffY;
if (document.documentElement && document.documentElement.scrollTop)
diffY = document.documentElement.scrollTop;
else if (document.body)
diffY = document.body.scrollTop
else
{/*Netscape stuff*/}
percent=.1*(diffY-lastScrollY);
if(percent>0)percent=Math.ceil(percent);
else percent=Math.floor(percent);
document.getElementById("full").style.top=parseInt(document.getElementById("full").style.top)+percent+"px";
lastScrollY=lastScrollY+percent;
/*if(diffY == 0){document.getElementById("full").style.display = "none"}
else{document.getElementById("full").style.display = "block"}
}*/
if(diffY > 450){document.getElementById("full").style.display = "block"}
else{
	document.getElementById("full").style.display = "none"}
}

suspendcode="<div id=\"full\" style='display:none; width:20px; height:59px; POSITION:absolute; left:1000px; top:200px; margin-left:213px;  z-index:100; text-align:center;'><a href='#respond'><img src='includes/templates/slucky/images/top_btn.gif' border=0 /></a></div>"
document.write(suspendcode);
window.setInterval("heartBeat()",1);


<!--
//双击自动滚屏
var currentpos, timer;
function initialize() {
    timer = setInterval("scrollwindow()", 10); //设置滚动的速度
}
function sc() {
    clearInterval(timer);
}
function scrollwindow() {
    window.scrollBy(0, 1);
}
document.onmousedown = sc;
document.ondblclick = initialize;
-->

carson

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
jquery js top 按钮

网页页要放一个top按钮方法一在我的网页里加载jquery的时候就有问题，还没找到原因所有又搞了一个方法二在IE6有点问题方法一、先要加载jqueryhtml测试无标题文档Top jquery 代码$(function(){var topBar='Top';$('#banggoo
复制链接

扫一扫

专栏目录