<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>JS PF taak: TagCloud</title>
<style media="screen" type="text/css">
<!--
}
#tagContainer {
position:relative;
background-color:#CFF;
margin:1em;
padding:0;
width: 500px;
height:400px;
overflow:hidden;
border:2px solid silver;
}
span.tag {
position:absolute;
top:0;
left:0;
}
-->
</style>
<script type="text/javascript">
var arrTags = [
["Javascript", 1634, 987],
["jQuery", 1111, 34],
["PHP", 1024,1122],
["Asp.Net", 977, 1005],
["Photoshop", 594, 789],
["XML", 40, 666],
["Access", 55, 77],
["Java", 278, 277],
["MySQL", 155, 122]
]
window.onload = function () {
var tagCont = document.getElementById('tagContainer');
for (var i = 0; i < arrTags.length; i++){
var eSpan = document.createElement('span');
eSpan.className = "tag";
var x = Math.floor(Math.random()*250);
var y = Math.floor(Math.random()*250);
eSpan.style.left = x +'px';
eSpan.style.top = y +'px';
eSpan.innerHTML = arrTags[i][0];
tagCont.appendChild(eSpan);
}
}
</script>
</head>
<body>
<div id="tagContainer"></div>
</body>
</html> |