<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<style type = "text/css">
#sp{ position:fixed; top:70%; left:82.5%; cursor:pointer;}
</style>
<script type = "text/javascript" src = "JueryPractice/jquery-1.7.2.min.js"></script>
<script type ="text/javascript">
$(document).ready(function () {
$("#sp").hide();
$(function () {
$(window).scroll(function () { //移动浏览器的滚动条时触发
if ($(window).scrollTop() > 100) {
$("#sp").fadeIn(1000);
}
else {
$("#sp").fadeOut(1000);
}
});
});
$("#sp img").click(function () {
$("body,html").animate({ scrollTop: 0 }, 1500, false);
});
//匹配id为sp选择器紧邻的第一个选择器
$("#sp + p").click(function () {
$("#sp + p").animate({ "height": 300 }); //改变元素的高度
});
$("#chui").click(function () {
alert($(window).scrollTop()); //获取滚动条距离浏览器顶端的垂直高度
});
$("#shui").click(function () {
alert($(window).scrollLeft());
});
});
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<p id = "sp"><span></span><img src = "images/2011082113443606.gif.jpg" alt = "无法显示" /></p>
<p style = " position:absolute; top:2000px; cursor:pointer; background-color:Green">顶部</p>
</div>
</form>
</body>
</html>
时间： 2024-10-29 19:11:56