View Single Post
  #3 (permalink)  
Old Feb 20th, 2008, 22:00
CloudedVision's Avatar
CloudedVision CloudedVision is offline
Nerdy Moderator
Join Date: Feb 2008
Location: In My Own Little World
Age: 14
Posts: 1,152
Blog Entries: 9
Thanks: 2
Thanked 34 Times in 34 Posts
Re: Random position of multiple divs

I was bored, so I fixed the mysterious errors (extra spaces were added for some reason) and made it work with multiple divs:

Code: Select all
<html>
<head>
<title>
Random Start Position Test
</title>

<style>
div {background-color:#cccccc;visibility:hidden;position:absolute}
</style>

<script>
// Cross Browser DOM
var aDOM = 0, ieDOM = 0, nsDOM = 0; var stdDOM = document.getElementById; if (stdDOM) aDOM = 1; else {ieDOM = document.all; if (ieDOM) aDOM = 1; else { var nsDOM = ((navigator.appName.indexOf('Netscape') != -1) && (parseInt(navigator.appVersion) ==4)); if (nsDOM) aDOM = 1;}}
function xDOM(objectId, wS) { if (stdDOM) return wS ? document.getElementById(objectId).style: document.getElementById(objectId); if (ieDOM) return wS ? document.all[objectId].style: document.all[objectId]; if (nsDOM) return document.layers[objectId]; }

// More Object Functions
function setObjVis(objectID,vis) {var objs = xDOM(objectID,1); objs.visibility = vis;}
function moveObjTo(objectID,x,y) {var objs = xDOM(objectID,1); objs.left = x; objs.top = y;}

// Browser Window Size and Position
function pageWidth() {return window.innerWidth != null? window.innerWidth: document.body != null? document.body.clientWidth:null;}
function pageHeight() {return window.innerHeight != null? window.innerHeight: document.body != null? document.body.clientHeight:null;}
function posLeft() {return typeof 
window.pageXOffset != 'undefined' ? 
window.pageXOffset:document.documentElement.scrollLeft? 
document.documentElement.scrollLeft:document.body. scrollLeft? 
document.body.scrollLeft:0;}
function posTop() {return typeof window.pageYOffset != 'undefined' 
? window.pageYOffset:document.documentElement.scrollTop? document.documentElement.scrollTop: document.body.scrollTop?document.body.scrollTop:0; }

objects = new Array("obj1", "obj2", "obj3", "obj4");

// Random Position Script
var xxx = new Array();
var yyy = new Array();

for(i=0; objects[i]; i++) {
    xxx[i]= Math.floor(Math.random()* (pageWidth()-230));
    yyy[i] = Math.floor(Math.random()* (pageHeight()-50));
}

function start() {
for(var i=0;obj=objects[i], obj; i++) {
var x = (posLeft()+xxx[i]) + 'px'; var y = (posTop()+yyy[i]) + 'px'; moveObjTo(obj,x,y); setObjVis(obj,'visible');
}
}
window.onload = start;
window.onscroll = start;
</script>
</head>
<body>
<div id="obj1">This is a web page object. 1</div>
<div id="obj2">This is a web page object. 2</div>
<div id="obj3">This is a web page object. 3</div>
<div id="obj4">This is a web page object. 4</div>
</body>
</html>
I won't always be around to do your work for you
__________________
echo "Take it easy, ".$CloudedVision;
.links { site: other-road-design; blog: only-nerds-allowed; project: resource-fish; project-2: kapp; }
<quote>&quot;I think it's wrong that only one company makes the game Monopoly&quot; - <name>Steven Wright</name></quote>
Reply With Quote