PDA

Click to See Complete Forum and Search --> : haha script

SearedIce
06-10-2003, 04:17 PM
I want a bunch of "Ha" to pop up on my page. I understand javascript and general programming very well but this script keeps erasing my page and writing a single ha, then giving me an error. The <script lang.... and </script> are currently under everything else in the html file...i have already tried having it in the <head></head> and <body></body> spaces...

function hadraw()
{
var left = Math.floor(Math.random() * 800);
var top = Math.floor(Math.random() * 600);
document.write("<div style='position:absolute; top:" + top + "; left:" + left + "; width:20px; height:20px'>HA</div>");
setTimeout("hadraw()",1000);
}
hadraw();

if i get rid of the setTimeout part, it writes a whole bunch of ha's on the right page, and does no erasing, but gives me a memory error in less than a second... i also want to be able to see each ha pop up...it can be fast but not instant

please help,
John
AdamBrill
06-10-2003, 05:35 PM
Is this what your looking for?<html>
<head>
<title>Untitled</title>
<script language="JavaScript" type="text/javascript">
function hadraw(){
var left = Math.floor(Math.random() * 800);
var top = Math.floor(Math.random() * 600);
element = document.createElement("div");
element.style.position="absolute";
element.style.top=top;
element.style.left=left;
element.style.width="20px";
element.style.height="20px";
element.innerHTML="HA";
document.body.appendChild(element);
//document.write("<div style='position:absolute; top:" + top + "; left:" + left + "; width:20px; height:20px'>HA</div>");
setTimeout("hadraw()",1000);
}
</script>
</head>
<body onload="hadraw();">
</body>
</html>
SearedIce
06-10-2003, 05:45 PM
yes, exactly!!

where can i fully learn and understand elements?

i like learning about stuff before using it...that way i never get caught copy/pasting gillions of scripts from source sites and having people ask for help trying to understand my code :)

thanks for your help, time to annoy my friends now!

~John
AdamBrill
06-10-2003, 05:48 PM
To learn how to use all of those commands, you might want to take a look at this: http://msdn.microsoft.com/workshop/author/dhtml/reference/objects/div.asp?frame=true I find it to be an extremely helpful resource, expecially when learning. ;)
freefall
06-10-2003, 10:53 PM
Wow, I know I'm an outsider in this conversation, but that website is amazing, I found my new favorite help site!
Thanks,
Ian
SearedIce
06-11-2003, 11:14 AM
I already know c++ so after looking at the code for a few minutes i understand it

i'm guessing the createElement(); function returns an element of whatever type you put in the parameter...

and another question...would i be right in using a div to do this? i've seen some people say <span>'s should be used for making stuff pop up but i've never tried so i wouldn't know

oh...and yet another question...how would i make the ha's dissapear?

i have an idea for that last question and i'll tell you if it works...

and in code in each div could i do something like:

this.style.width=10000000;

??

~John
AdamBrill
06-11-2003, 11:35 AM
Are you trying to get only one HA on the screen at a time? If so, try this code:<html>
<head>
<title>Untitled</title>
<script language="JavaScript" type="text/javascript">
function hadraw(){
document.getElementById('hadiv').style.top=Math.floor(Math.random() * 600);
document.getElementById('hadiv').style.left=Math.floor(Math.random() * 800);
setTimeout("hadraw()",1000);
}
</script>
</head>
<body onload="hadraw();">
<div id="hadiv" style="position:absolute; top:-100px; left:-100px; width:20px; height:20px;">HA</div>
</body>
</html>
SearedIce
06-11-2003, 11:41 AM
cool, thanks, but i want either the screen to fill up entirely, then reset (without visitors loosing their place in my iframe)

or...

have each "ha" timeout after like 5 seconds

i'm working on the latter...this is so nice having a half day of school

~John
SearedIce
06-11-2003, 02:39 PM
for those of you that havn't read my "Scripting in scripting" post, i solved all my problems and the final script is:

<script language="javascript">
var numberofhas = 2;
someelements = new Array(numberofhas);
var counter = -1;
var counter2 = 0;
function hadraw()
{
counter = counter + 1;
counter2 = counter2 + 1;
if (counter == numberofhas)
{
counter = 0
}
var left = Math.floor(Math.random() * 800);
var top = Math.floor(Math.random() * 600);
if (counter2 < numberofhas+1)
{
someelements[counter] = document.createElement("div")
someelements[counter].style.position = "absolute"
someelements[counter].style.width = "20px"
someelements[counter].style.height = "20px"
someelements[counter].style.color = "white"
someelements[counter].innerHTML = "<b>HA</b>"
document.body.appendChild(someelements[counter])
}
someelements[counter].style.top = top;
someelements[counter].style.left = left;
setTimeout("hadraw()",1000);
}
hadraw();
</script>

it makes an array of "ha"s with random locations then cycles through array again to pick new locations...it keeps cycling through forever :)

here's the result on my website with 50 ha's:

http://www14.brinkster.com/drakej

Thanks for everybody's help especially Adambrill with the document.createElement(); idea!

~John