joshua/beats-website
Archived
1
Fork 0
Code Activity

made bullets position correctly

Browse source
This commit is contained in:
Joshua Moerman 2013-03-10 12:08:45 +01:00
parent a59f5c75cd
commit 9465420e35
1 changed files with 13 additions and 5 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

18
index.html
View file

@ -13,10 +13,18 @@
opacity: 0.5; opacity: 0.5;
} }
.user { .user {
-webkit-transition: left 0.5s, top 0.5s; -webkit-transition: left 0.5s linear, top 0.5s linear;
font-size: 20px;
position: absolute; position: absolute;
} }
.user .bullet {
width: 10px;
height: 10px;
position: absolute;
left: -5px;
top: -5px;
border-radius: 5px;
background-color: #f00;
}
.user .name { .user .name {
border-radius: 2px; border-radius: 2px;
font-size: 12px; font-size: 12px;
@ -30,11 +38,11 @@
var websocket; var websocket;
function init() { function init() {
document.getElementById("myName").innerHTML = myName;
if ("WebSocket" in window){ if ("WebSocket" in window){
document.getElementById("myName").innerHTML = myName;
testWebSocket(); testWebSocket();
} else { } else {
document.getElementById("status").innerHTML = 'No websockets :('; document.getElementById("status").innerHTML = 'No websockets :(. This means that you either use <em>Internet Explorer</em> or <em>Android</em>. In both cases, I suggest that you use <a href="http://www.google.com/chrome/">Chrome</a> or <a href="http://www.getfirefox.net/">Firefox</a>!';
} }
} }
function testWebSocket() { function testWebSocket() {
@ -65,7 +73,7 @@
var user = document.createElement('div'); var user = document.createElement('div');
user.id = people[i].name; user.id = people[i].name;
user.className = 'user'; user.className = 'user';
user.innerHTML = '&bull; '; user.innerHTML = '<div class="bullet"></div>';
user.appendChild(name); user.appendChild(name);
user.style.left = people[i].position.x + "px"; user.style.left = people[i].position.x + "px";
user.style.top = people[i].position.y + "px"; user.style.top = people[i].position.y + "px";