浮动窗口

<!DOCTYPE html>  
<html xmlns="http://www.w3.org/1999/xhtml">  
<head>  
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />  
	<title>无标题文档</title>  
	<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script>
	<style>
		#content{
			width: 150%;
			height: 1000px;
		}
		#advert{
			border: 1px solid black;
			position: absolute;
			width: 200px;
			height: 100px;
			right: 0;
			bottom: 0;
			margin: 10px;
		}
	</style>
</head>  
  
<body>  
	<div id="content">content</div>
	<div id="advert">advert</div>
	<script>
		var time; 
		$(window).scroll(function (){
			if (time){
				clearTimeout(timeout);
			}
			time = setTimeout(function(){  
				var scrollTop = $(window).scrollTop(),
		        	scrollLeft = $(window).scrollLeft();
				$("#advert").animate({
					'right': '-' + scrollLeft + 'px',
					'bottom': '-' + scrollTop + 'px'
				}, 200);
			},100);
		});
    </script>
</body>  
</html>

你可能感兴趣的:(scroll)