Advanced Search

Return to Snippet

Revision: 41095
at February 11, 2011 23:21 by tcelestino
Initial Code 
<!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>Untitled Document</title>
<script type="text/javascript" src="jquery-1.5.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
	var top;
	var $div = $('#centro');
	$(window).bind('scroll resize',function(){
		$div.html($(this).scrollTop());
		top = $(this).scrollTop() + ($(this).height()-$div.outerHeight())/2;	
		$div.css('top', top+'px');
	});
	$(window).trigger('scroll');
});
</script>
<style type="text/css">
	#centro {
		width: 500px;
		height: 350px;
		padding: 10px;
		border: solid 1px #666;
		background: #EAEAEA;
		
		position: absolute;
		left: 50%;
		margin-left: -250px;
	}
</style>
</head>

<body>
<div id="centro">:D</div>
<p>adasdasdas</p>
<p>adasdasdas</p>
<p>adasdasdas</p>
<p>adasdasdas</p>
<p>adasdasdas</p>
<p>adasdasdas</p>
<p>adasdasdas</p>
<p>adasdasdas</p>
<p>adasdasdas</p>
<p>adasdasdas</p>
<p>adasdasdas</p>
<p>adasdasdas</p>
<p>adasdasdas</p>
<p>adasdasdas</p>
<p>adasdasdas</p>
<p>adasdasdas</p>
<p>adasdasdas</p>
<p>adasdasdas</p>
<p>adasdasdas</p>
<p>adasdasdas</p>
<p>adasdasdas</p>
<p>adasdasdas</p>
<p>adasdasdas</p>
<p>adasdasdas</p>
<p>adasdasdas</p>
<p>adasdasdas</p>
<p>adasdasdas</p>
<p>adasdasdas</p>
<p>adasdasdas</p>
<p>adasdasdas</p>
<p>adasdasdas</p>
<p>adasdasdas</p>
<p>adasdasdas</p>
<p>adasdasdas</p>
<p>adasdasdas</p>
<p>adasdasdas</p>
<p>adasdasdas</p>
<p>adasdasdas</p>
<p>adasdasdas</p>
<p>adasdasdas</p>
<p>adasdasdas</p>
<p>adasdasdas</p>
<p>adasdasdas</p>
<p>adasdasdas</p>
<p>adasdasdas</p>
<p>adasdasdas</p>
<p>adasdasdas</p>
<p>adasdasdas</p>
<p>adasdasdas</p>
<p>adasdasdas</p>
<p>adasdasdas</p>
<p>adasdasdas</p>
<p>adasdasdas</p>
<p>adasdasdas</p>
<p>adasdasdas</p>
<p>adasdasdas</p>
<p>adasdasdas</p>
<p>adasdasdas</p>
<p>adasdasdas</p>
<p>adasdasdas</p>
<p>adasdasdas</p>
<p>adasdasdas</p>
<p>adasdasdas</p>
<p>adasdasdas</p>
<p>adasdasdas</p>
<p>adasdasdas</p>
<p>adasdasdas</p>
<p>adasdasdas</p>
<p>adasdasdas</p>
<p>adasdasdas</p>
<p>adasdasdas</p>
<p>adasdasdas</p>
<p>adasdasdas</p>
<p>adasdasdas</p>
<p>adasdasdas</p>
<p>adasdasdas</p>
<p>adasdasdas</p>
<p>adasdasdas</p>
<p>adasdasdas</p>
<p>adasdasdas</p>
<p>adasdasdas</p>
<p>adasdasdas</p>
<p>adasdasdas</p>
<p>adasdasdas</p>
<p>adasdasdas</p>
<p>adasdasdas</p>
<p>adasdasdas</p>
<p>adasdasdas</p>
<p>adasdasdas</p>
<p>adasdasdas</p>
<p>adasdasdas</p>
<p>adasdasdas</p>
<p>adasdasdas</p>
</body>
</html>
Initial URL 









Initial Description














Initial Title





align center div









Initial Tags





css, jquery, center









Initial Language





jQuery