a DIFFERENT random than what anybody else wants!

[soundoctor]

All the "random" pix scripts I see are essentially the same.
What I want is ... I'll explain it linearly:

a) I have a word on the page.
b) I make a link out of it (javascript:
c) user clicks
d) a new page opens correctly sized to an image.
e) the images are chosen at random from some pix in a subdirectory.

There might be 2 pix or 30. They might be different but appropriate sizes: 400 x 320, or 525 x 405 px, etc etc.

DESIRED RESULT: everytime someone clicks on what looks like a 'standard' link a window opens with a different picture.

Whew!

Thanks,
The Soundoctor

[Bob90]

<img id="testSize" src="" style="visibility:hidden">
<script>
function openWindow(imageName)
	{
	subDirectory = "images/"
	document.getElementById("testSize").src = subDirectory+imageName
	
	windowOps = "toolbar=no,location=no,directories=no,status=no,menubar=no,scrollbars=no,resizable=no,"
    windowOps+= "width="+parseInt(document.getElementById("testSize").width)+","
	windowOps+= "height="+parseInt(document.getElementById("testSize").height)+","
	windowOps+= "left=250,top=50";
	ImageWindow = window.open("","ImageWindow",windowOps);
	windowHTML = "<img src=\""+(subDirectory+imageName)+"\">"
	self.ImageWindow.document.clear();
	self.ImageWindow.document.write(windowHTML);
	self.ImageWindow.focus();
	self.ImageWindow.document.close();
	}
openWindow("blog.png")
</script>

Any problems just ask

[Bob90]

This should work.

<!-- your links-->
<a href="Javascript:chooseRandomPic()">Random Picture Link</a>

<!-- img used to get width and height dynamically-->
<img id="testSize" src="" style="visibility:hidden; position:absolute; top:-10000; left:-10000;">
<script>
picArray = new Array("blog.png","pic2.gif","pic3.jpg") //All pics you wan to include
subDirectory = "images/" //subdirectory of images to use

function chooseRandomPic()
	{
	openWindow(picArray[Math.floor(Math.random(picArray.length))])
	}
	
function openWindow(imageName)
	{
	document.getElementById("testSize").src = subDirectory+imageName
	
	windowOps = "toolbar=no,location=no,directories=no,status=no,menubar=no,scrollbars=no,resizable=no,"
    windowOps+= "width="+parseInt(document.getElementById("testSize").width)+","
	windowOps+= "height="+parseInt(document.getElementById("testSize").height)+","
	windowOps+= "left=250,top=50";
	ImageWindow = window.open("","ImageWindow",windowOps);
	windowHTML = "<img src=\""+(subDirectory+imageName)+"\">"
	self.ImageWindow.document.clear();
	self.ImageWindow.document.innerHTML=""
	self.ImageWindow.document.write(windowHTML);
	self.ImageWindow.focus();
	self.ImageWindow.document.close();
	}

</script>

p.s. NOT really a different type of random at all

[soundoctor]

Hey, thanks !!!!!!!!!!!!
I'm going off to experiment and see both how smart you are and how much I have to learn.
If you don't hear back from me in a coupla days, send a search party.
Soundoctor

[soundoctor]

Bob90,
Well then...
Maybe I'm a little lame but... I can't get it to work.

I'll paste the stuff in here in color so you can correct me.

This part should go in the body somewhere where my link is supposed to be:

<!-- your links-->
<a href="javascript:chooseRandomPic()">Random Picture Link</a>

<!-- img used to get width and height dynamically-->
<img id="testSize" src="" style="visibility:hidden; position:absolute; top:-10000; left:-10000;">

Then the script part should go where -- in the head? (I tried it in the head area; I also tried it just below the opening body tag...nothing)
I made a new pics folder, loaded it and matched the names up, etc; so the script now looks like this:

<script>
picArray = new Array("blaze1.jpg","blaze3.jpg","cats2.jpg", "elfin1.jpg", "monk1.jpg", "tiny1.jpg") //All pics you wan to include
subDirectory = "images/cats/" //subdirectory of images to use

function chooseRandomPic()
{
openWindow(picArray[Math.floor(Math.random(picArray.length))])
}

function openWindow(imageName)
{
document.getElementById("testSize").src = subDirectory+imageName

windowOps = "toolbar=no,location=no,directories=no,status=no,menubar=no,scrollbars=no,resizable=no,"
windowOps+= "width="+parseInt(document.getElementById("testSize").width)+","
windowOps+= "height="+parseInt(document.getElementById("testSize").height)+","
windowOps+= "left=250,top=50";
ImageWindow = window.open("","ImageWindow",windowOps);
windowHTML = "<img src=\""+(subDirectory+imageName)+"\">"
self.ImageWindow.document.clear();
self.ImageWindow.document.innerHTML=""
self.ImageWindow.document.write(windowHTML);
self.ImageWindow.focus();
self.ImageWindow.document.close();
}

</script>


If I open the page it's fine but if I click on that link I get a script error. I tried it both locally and after uploading everything to the server. Also tried all the usual browser suspects. Nada.

I should point out there are NO other javascript items on the page - it's a dirt simple html page with some text.

While I'm no coding expert, i have done some insanely complex mouseovers and fever windows and dhtml stuff all on one page with not too much trouble - I'm not a complete novice.

But obviously I'm doing something wrong?

Soundoctor