All pastes #236548 Raw Edit

Something

public text v1 · immutable
·published 2006-11-03 21:30 UTC
rendered paste body
CSS

html {
width: 100%;
background-image: url("neanderthal/bg.gif");
margin:0px;
}

body {
width: 980px;
margin: 0px;
margin-left: auto;
margin-right: auto;
font: 8pt verdana, tahoma, arial;
}

#content{
width: 980px;
height: 99%;
margin: 0px;
margin-left: auto;
margin-right: auto;
position:absolute;
min-height:400px;
}

.t {
background: url(neanderthal/bg_top.gif) 0 0 repeat-x; width: 100%;}
.b {background: url(neanderthal/bg_bottom.gif) 0 100% repeat-x}
.l {background: url(neanderthal/bg_left.gif) 0 0 repeat-y}
.r {background: url(neanderthal/bg_right.gif) 100% 0 repeat-y}
.bl {background: url(neanderthal/bg_left_corner_bottom.gif) 0 100% no-repeat;margin-left: -12px;}
.br {background: url(neanderthal/bg_right_corner_bottom.gif) 100% 100% no-repeat}
.tl {background: url(neanderthal/bg_left_corner.gif) 0 0 no-repeat}
.tr {background: url(neanderthal/bg_right_corner.gif) 100% 0 no-repeat; padding:10px}
.data{
width:100%;
height:auto;
margin-left:10px;
margin-right:10px;
margin-top:0px;
margin-bottom:5px;
overflow:auto;

}

#top {
width: 100%;
height: 120px;
color: #000000;
}

#topframe{
position:absolute;
height:84px;
width:820px; 
background-color: #7e724f;
left:160px;
}
#topframe .data{
height:60px;

}
.topitem{
margin-top:1px;
float:left;
width:260px;
}

.logo{
float:left;
}

.menu{
position:absolute;
left: 0px;
width: 160px;
top: 120px;
background-color: #7e724f;
bottom:165px;
overflow:auto;
}

.menu .data{
width:145px;

margin-bottom:0px;
height:100%;
bottom:0px;
}

#rightpanel{
position:absolute;
width: 270px;
top:80px;
right:0px;
background-color: #7e724f;
bottom:165px;
}

#rightpanel .data{
height:100%;
width:255px;
margin-bottom:0px;

}

.bName{
height: 9pt;
width:120px;
float:left;
position: relative;
}

.bValue{
width:20px;
float:left;
position: relative;
}

.bStatus{
color:red;
width:100px;
float:left;
position: relative;
}

.pm {
position:absolute;
right:0px;
width: 270px;
bottom:0px;
background-color: #7e724f;
height:150px;
}

.pm .data {
height:126px;
}

.pm .NewMessages{
text-align:center;
color:red;
}

.bottom{
position:absolute;
left:0;
width: 705px;
height: 150px;
bottom:0px;
background-color: #7e724f;

}

.bottom .data{
height: 126px;
}

#main{
text-align: center;
vertical-align: middle;
width: 540px;
position: absolute;
overflow:hidden;
top:80px;
left: 165px;
bottom: 155px;
cursor: move;
}



.resources {
text-align: left;
left:167px;
position: absolute;
width: 100%;
bottom:  157px;
color: #fff;
}

.out {
	position: absolute;
	width:150px;
	bottom: 157px;
	right: 290px;
	color: #fff;
	text-align:right;
}

.leadercontainer {
	position:absolute;
	width: 100%;
	top: 85px;
	left: 167px;
	
}

.leader {
	color: #fff;
	text-align: left;
	float: left;
	width:180px;
}

.map {
vertical-align: middle;

}





HTML





<meta http-equiv="content-type" content="text/html; charset=iso-8859-1">
<link rel="stylesheet" href="../style.css" type="text/css">

<html>
	<head>
		<script src="js/prototype.js" type="text/javascript"></script>
		<script src="js/scriptaculous.js" type="text/javascript"></script>
		<script type="text/javascript" language="javascript">
			function ajaxGet(Element,Url){
				new Ajax.Updater(Element, Url, {asynchronous:true, evalScripts:true});
				var objDiv = document.getElementById(Element);
				objDiv.scrollTop = 0;
			}
			function ajaxPost(Element,Url,Data){
				new Ajax.Updater(Element, Url, {asynchronous:true, evalScripts:true, method:'post', postBody:Data})
				var objDiv = document.getElementById(Element);
				objDiv.scrollTop = 0;
			}
			function addText(text) {
				document.quote.quote.value += text;
			}
			var mouseLastX=0, mouseLastY=0;
			var posX=0, posY=0;
			var viewWidth = 0;
			var viewHeight = 0;
			var start=0;
			function scrollMouse(e){
				if (start==1){
					var sbox = $('main');
					var thisX = e.clientX;
					var thisY = e.clientY;
					if (mouseLastX>0) {
						dx = thisX - mouseLastX;
						posX = posX-dx;
						if (posX <0) posX =0;
						if (posX > (sbox.scrollWidth - viewWidth)) posX = sbox.scrollWidth - viewWidth;
						sbox.scrollLeft = posX;
					}
					if (mouseLastY>0) {
						dy = thisY - mouseLastY;
						posY = posY-dy;
						if (posY <0) posY =0;
						if (posY > (sbox.scrollHeight - viewHeight)) posY = sbox.scrollHeight - viewHeight;
						sbox.scrollTop = posY;
					};
					mouseLastX = thisX;
					mouseLastY = thisY;
				}
			};

			startScrollMouse = function (){
				start = 1;
// 				document.onmousemove= scrollMouse;
			};

			stopScrollMouse = function (){
				start = 0;
// 				document.onmousemove = null;
				mouseLastX=0;
				mouseLastY=0
			};
		</script>
		<link href="styles/style_neanderthal.css" rel="stylesheet" type="text/css" />
		<meta http-equiv="content-type" content="text/html; charset=iso-8859-1">
		<title>RoswellBC</title>
	</head>
	<body>
<div id="content">

<div id="top">

<img class="logo" src="images/logo.gif">
<div id="topframe">
<div class="t"><div class="b"><div class="l"><div class="r"><div class="bl"><div class="br"><div class="tl"><div class="tr"><div class="data">
<span class="topitem"><b>Village Population:</b> 180</span><span class="topitem"><b>Villagers Gathering:</b> 134</span><span class="topitem"><b>Community Perform.:</b> Excellent</span><span class="topitem"><b>Alliance:</b> Illuminati</span><span class="topitem"><b>Troops in Village:</b> 64</span><span class="topitem">&nbsp;</span><span class="topitem"><b>Building:</b> Military School</span><span class="topitem"><b>Rank:</b> 2</span>
</div></div></div></div></div></div></div></div></div></div>
</div>

<div class="menu">
<div class="t"><div class="b"><div class="l"><div class="r"><div class="bl"><div class="br"><div class="tl"><div class="tr"><div class="data"><b>Index</b><br />
Camp Index<br />
<b>Rankings</b><br />
User Rankings<br />
Alliance Rankings<br />
<b>Game Menu</b><br />
Vote of the Day<br />
Guide to Roswell<br />
Users Online<br />
Help Desk<br />
Profile<br />
Logout<br />
<b>Forums</b><br />
Forums<br />
Forums Reports<br /><br />
<b>Admin</b><br />
Admin CP<br />
VOTD Admin<br /><br />
<b>Village to manage</b><br />
Combobox here...
</div></div></div></div></div></div></div></div></div></div>
<div id="rightpanel">
<div class="t"><div class="b"><div class="l"><div class="r"><div class="bl"><div class="br"><div class="tl"><div class="tr"><div class="data"><center><b>Buildings</b></center><br />
<center><b>Creation</b></center>
<div class="bName">Creation Hut</div><div class="bValue">9</div><div class="bStatus">&nbsp;</div>
<center><b>Military</b></center>
<div class="bName">ATC</div><div class="bValue">6</div><div class="bStatus">Damaged</div>
<div class="bName">Blacksmith</div><div class="bValue">8</div><div class="bStatus">&nbsp;</div>
<div class="bName">WDDC</div><div class="bValue">9</div><div class="bStatus">&nbsp;</div>
<center><b>Housing Huts</b></center>
<div class="bName">House 1</div><div class="bValue">6</div><div class="bStatus">&nbsp;</div>
<div class="bName">House 2</div><div class="bValue">7</div><div class="bStatus">&nbsp;</div>
<div class="bName">House 3</div><div class="bValue">6</div><div class="bStatus">&nbsp;</div>
<div class="bName">House 4</div><div class="bValue">7</div><div class="bStatus">&nbsp;</div>
<div class="bName">House 5</div><div class="bValue">8</div><div class="bStatus">&nbsp;</div>
<center><b>Camp Defense</b></center>
<div class="bName">Wall</div><div class="bValue">10</div><div class="bStatus">&nbsp;</div>




&nbsp;
</div></div></div></div></div></div></div></div></div></div>
<div class="pm" id="pm">
<div class="t"><div class="b"><div class="l"><div class="r"><div class="bl"><div class="br"><div class="tl"><div class="tr"><div class="data"><b><center>Private Messages</center></b><br />
<div class="NewMessages">You have a new message</div>
<br />
<center>Inbox(<b>1</b>) / New Message</center>
</div></div></div></div></div></div></div></div></div></div>

<div class="bottom" id="bottom">
<div class="t"><div class="b"><div class="l"><div class="r"><div class="bl"><div class="br"><div class="tl"><div class="tr"><div class="data">building stuff :P
</div></div></div></div></div></div></div></div></div></div>

<div id="main" onMouseMove="scrollMouse(event)" onMouseDown = "startScrollMouse();return false;" onMouseUp = "stopScrollMouse();">
	<table width="100%" height="100%" cellpading="0" cellspacing="0" border="0"><tr><td valign="middle"><center>
		<div class="map">
			<a href="#"><img width="1000px" src="styles/neanderthal/NeanWall1.gif">hgkjgk</a>
		</div></center>
	</td></tr></table>

</div>
	<div class="resources"><b>Wood:</b> 280 <b>Clay:</b> 134 <b>Stone:</b> 1345 <b>Animal:</b> 324</div>
	<div class="out">Gather Resources<br />Send Out Troops<br />Search for Trades<br />Go to Map</div>
	<div class="leadercontainer">
		<div class="leader"><b>Name:</b> Wolve<br /><b>Rank:</b> King</div>
		<div class="leader"><b>Fear:</b> Progressbar<br /><b>Respect:</b>Progressbar</div>
		<div class="leader">Perform<br />Leader Actions</div>
	</div>
</div>
	</body>
</html>