Hej udviklere
Jeg er igang med en 2D Chat, som jeg vil prøve så vidt muligt at bygge op fra bunden. Jeg er kommet til at tænke på, om i har en CSS kode, der kan få navnet på brugeren, og evt. taleboblen til brugeren til at følge brugeren, når han skifter felt. Jeg vil så vidt muligt undgå at opdatere et felt hver gang, hvis det vel og mærke er muligt
.
Altså hvis jeg har min mand på et af felterne, skal taleboblen være lidt til højre for ham, mens hans navn, skal være under ham. Hvis jeg så rykker ham til et andet felt, skal de egenskaber også følge med.
I mit rykke system bruger jeg javascript, som ser sådan her ud:
<html>
<head>
<title>PoshTown</title>
<style>
#board td {
width: 80px;
height: 80px;
text-align: center;
vertical-align: middle;
cursor: pointer;
}
#figure {
width: 60px;
height: 80px;
font: 1px verdana;
background-image: url('Poshmand.gif');
}
</style>
<script type="text/javascript">
var last_field = null;
function moveElement(idx) {
obj = document.getElementById(idx);
if (last_field != null) last_field.innerHTML = " ";
document.getElementById(idx).innerHTML = '<div><img src="Poshmand.gif" width="60" height="80"></div>';
last_field = obj;
}
</script>
</head>
<body class="right" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0" style="background-color :transparent" oncontextmenu="return false" ondragstart="return false" onselectstart="return false">
<table id="board" background="bg.gif" border="0" cellpadding="0" cellspacing="0">
<tr>
<td id="1_1" onclick="moveElement(this.id)"> </td>
<td id="1_2" onclick="moveElement(this.id)"> </td>
<td id="1_3" onclick="moveElement(this.id)"> </td>
<td id="1_4" onclick="moveElement(this.id)"> </td>
<td id="1_5" onclick="moveElement(this.id)"> </td>
</tr><tr>
<td id="2_1" onclick="moveElement(this.id)"> </td>
<td id="2_2" onclick="moveElement(this.id)"> </td>
<td id="2_3" onclick="moveElement(this.id)"> </td>
<td id="2_4" onclick="moveElement(this.id)"> </td>
<td id="2_5" onclick="moveElement(this.id)"> </td>
</tr><tr>
<td id="3_1" onclick="moveElement(this.id)"> </td>
<td id="3_2" onclick="moveElement(this.id)"> </td>
<td id="3_3" onclick="moveElement(this.id)"> </td>
<td id="3_4" onclick="moveElement(this.id)"> </td>
<td id="3_5" onclick="moveElement(this.id)"> </td>
</tr><tr>
<td id="4_1" onclick="moveElement(this.id)"> </td>
<td id="4_2" onclick="moveElement(this.id)"> </td>
<td id="4_3" onclick="moveElement(this.id)"> </td>
<td id="4_4" onclick="moveElement(this.id)"> </td>
<td id="4_5" onclick="moveElement(this.id)"> </td>
</tr><tr>
<td id="5_1" onclick="moveElement(this.id)"> </td>
<td id="5_2" onclick="moveElement(this.id)"> </td>
<td id="5_3" onclick="moveElement(this.id)"> </td>
<td id="5_4" onclick="moveElement(this.id)"> </td>
<td id="5_5" onclick="moveElement(this.id)"> </td>
</tr>
</table>
<script type="text/javascript">moveElement('1_1');</script>
</body>
</html>
Indlæg senest redigeret d. 12.04.2007 22:31 af Bruger #11637