Click to See Complete Forum and Search --> : Random image popup to new window when clicked?


Awetopsy
05-05-2004, 01:20 PM
Hi Im brand spanking new here and pretty new to JavaScript. I can fake my through it but Im stuck now with this problem.

Here is what Im trying to do:

I have a few thumbnail images in a folder that I have rotating randomly on each refresh or click.
I have the full size images in another folder which I want to open in a new window when the corresponding image is clicked in the random image window. (is that clear?)

Basically I want the random image window to advance to the next random image but also bring up the full size image in the new window.

here is my code:

in the "<head>" tag


var rand1 = 0;
var useRand = 0;
var globalWindow;
var globalBrowserName = navigator.appName;
var globalBrowserVersion = parseInt(navigator.appVersion);

images = new Array;
images[1] = new Image();
images[1].src = "iom/boss_01.jpg";
images[2] = new Image();
images[2].src = "iom/franky.jpg";
images[3] = new Image();
images[3].src = "iom/catearcher.jpg";
images[4] = new Image();
images[4].src = "iom/llama.jpg";
images[5] = new Image();
images[5].src = "iom/jester.jpg";

function swapPic() {
var imgnum = images.length - 1;
do {
var randnum = Math.random();
rand1 = Math.round((imgnum - 1) * randnum) + 1;
} while (rand1 == useRand);
useRand = rand1;
document.randimg.src = images[useRand].src;
}

function openWindow(imageName, winWidth, winHeight) {

if ( globalBrowserName == "Netscape" && globalBrowserVersion > 2) {
if ( globalWindow ) {
if ( globalWindow.document ) {
globalWindow.close();
}
}
} else {
if ( globalBrowserName == "Microsoft Internet Explorer" && globalBrowserVersion > 2) {
if ( globalWindow ) {
globalWindow.close();
}
}
}

globalWindow = window.open("", "PopUp", "width=" + (winWidth + 30) + ",height=" + (winHeight + 50) + " ,scrollbars=0,toolbar=0,resizable=1,location=0,men
ubar=0");

globalWindow.document.writeln('<HTML>');
globalWindow.document.writeln('<HEAD><!--BASE HREF="http://www.noelnissen.com/"--></HEAD>');
globalWindow.document.writeln('<BODY BGCOLOR="#336699" link="7194B8" vlink="7194B8" alink="7194B8" text="A3BAD1">');
globalWindow.document.writeln('<CENTER>\n');
globalWindow.document.writeln('<A HREF="java script:self.close()">close this window</A><BR>');
globalWindow.document.writeln('<IMG SRC="gallery/' + imageName + '" WIDTH=' + winWidth + ' HEIGHT=' + winHeight + '><BR>');
globalWindow.document.writeln('</CENTER>\n');
globalWindow.document.writeln('</BODY>');
globalWindow.document.writeln('</HTML>');

return;
}
//-->
</script>


in the <body> tag Ive put:

OnLoad="swapPic()"


and then inside the body Ive got:

<a onClick="swapPic();" href="javascript: openWindow()"><img name="randimg" src=""></a><br>


It does open the new window for me but it wont show any graphics.. I think its because It cant tell which random image is currently being displayed.. but I have no idea how to do that.

Am I going about this the worng way? Any help would be greatly appreciated.

oh and sorry If im posting too much of the code.

thanx.

Kor
05-06-2004, 02:12 AM
<a onClick="swapPic();" href="java script: openWindow()">


make up your mind. Either you fire both function using onclick handler or you fire them using non-standard javascript: code inside the href attribute.

<a onClick="swapPic();openWindow();return false" href="#">

<a href="javascript:void(swapPic();openWindow();return true)">