Click to See Complete Forum and Search --> : Help on random image swap when page loads + random link
TangLung
06-01-2003, 07:58 PM
Hi everyone!
I am a newbie in this forum and I need your help ...
I am not that well-versed in javascripting but I am learning bit by bit. I need help on javascripting combo. What I want to ahieve in simplest term is this :
Random image swap everytime a page loads + Image link + Link opens a new window with my specs (i.e. toolbars=0, scrollbars=0, status bar=0, width= 50, etc.)
Javascript source only has the random image swap when page loads. I think it also has the random image swap with link but when link is clicked, it opens in the same page (_parent). I tried using "traget=_blank" and put window specs. It worked, yes but it didn't have the window specs.
Can a anyone help me out with this combo ? I am desperate... please....
Thanks in advance.
troymariano@yahoo.com
http://troy.interactiveltd.com
TangLung
06-02-2003, 04:08 AM
Thanks Dave for your prompt reply. Very much appreciated.
Here's what I have... (Got these from javascript source before)
I. RANDOM IMAGE SWAP WHEN PAGE LOADS (w/o links)
HEAD TAG
<SCRIPT LANGUAGE="JavaScript">
<!-- Begin
var rand1 = 0;
var useRand = 0;
images = new Array;
images[1] = new Image();
images[1].src = "image1.gif";
images[2] = new Image();
images[2].src = "image2.gif";
images[3] = new Image();
images[3].src = "image3.gif";
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;
}
// End -->
</script>
BODY Tag
onLoad="swapPic()"
II. RANDOM IMAGE SWAP WHEN PAGE LOADS (WITH LINKS) using document.write
HEAD Tag
<script language="JavaScript">
<!-- Hide this script from old browsers --
var imagenumber = 5 ;
var randomnumber = Math.random() ;
var rand1 = Math.round( (imagenumber-1) * randomnumber) + 1 ;
images = new Array
images[1] = "image1.gif"
images[2] = "image2.gif"
images[3] = "image3.gif"
var image = images[rand1]
links = new Array
links[1] = "link1.htm"
links[2] = "link2.htm"
links[3] = "link3.htm"
var link = links[rand1]
// -- End Hiding Here -->
</script>
BODY Tag
<script language="JavaScript">
<!-- Hide this script from old browsers --
document.write('<A HREF="'+ link +'"><IMG SRC="' + image + '" border="0"></a>')
// -- End Hiding Here -->
</script>
III. OPEN NEW WINDOW
onClick="NewWin=window.open('[URL]','[WindowName]','toolbar=0,status=0,width=640,height=400,location=center,scrollbars=1')"
WHAT I NEED...
I need to make use of the Random Image Swap with Links and everytime a user clicks on an image, it links to the corresponding URL. I tried combining these scripts and I get errors. Here's a sample combo of what I did (see BODY Tag) :
HEAD Tag
<script language="JavaScript">
<!-- Hide this script from old browsers --
var imagenumber = 5 ;
var randomnumber = Math.random() ;
var rand1 = Math.round( (imagenumber-1) * randomnumber) + 1 ;
images = new Array
images[1] = "image1.gif"
images[2] = "image2.gif"
images[3] = "image3.gif"
var image = images[rand1]
links = new Array
links[1] = "link1.htm"
links[2] = "link2.htm"
links[3] = "link3.htm"
var link = links[rand1]
// -- End Hiding Here -->
</script>
BODY Tag (This is where I made a few changes)
<script language="JavaScript">
<!-- Hide this script from old browsers --
document.write('<A onClick="NewWin=window.open('+ link +','NewWin','toolbar=0,status=0,width=640,height=400,location=center,scrollbars=1')" HREF="'#'"><IMG SRC="' + image + '" border="0"></a>')
// -- End Hiding Here -->
</script>
** Notice I've placed "onClick" before HREF and replaced URL holder with "+ link +" As for HREF, I made it "#." The result of this combo didn't give me what I wanted. Worst, it turned out to be an error. I think problem s exist in the manner I use ("") and (' '). Or, the document.write does not allow "onClick" or any similar functions.
ANOTHER THING I DID ...
BODY Tag
<script language="JavaScript">
<!-- Hide this script from old browsers --
document.write('<A HREF="'+ link +'" target="_blank, toolbar=0,status=0,width=640,height=400,location=center,scrollbars=1" ><IMG SRC="' + image + '" border="0"></a>')
// -- End Hiding Here -->
</script>
** Notice I've used "target=_blank" and added the window specs. Like the first one, this approach didn't yield a successful script.
I would really appreciate helping me out with this as I am finishing a project that requires the script.
:(
TangLung
06-02-2003, 07:16 PM
When I ran the combo script I made, my browser (i.e. IE 5.5) did not recognize it, that is to say, it didn't display any images or links that reside on these images. It was totally blank.
I am using Frontpage 2000 as my HTML Editor. When I ran my script on Preview mode, error message sited that I have a problem in line 41 character 60 (I don't know if this will help).
This is the line of code where I am having, I think, problems :
BODY Tag
<script language="JavaScript">
<!-- Hide this script from old browsers --
document.write('<A onClick="NewWin=window.open('+ link +','NewWin','toolbar=0,status=0,width=640,height=4
00,location=center,scrollbars=1')" HREF="#"><IMG SRC="' + image + '" border="0"></a>')
// -- End Hiding Here -->
</script>
** I am not sure if the "onClick" function is allowed in the document.write as well as having the "+ link +" inside the "onClick" function.
In a nutshell, my ideal script would be something like :
A script that randomly changes images upon page reload and per image, it has to have a link to a new page/window that possesses specifications I made (i.e. toolbars=0,scrollbars=0, etc.)
Thanks, Dave, for patiently helping me out on this. Hope we could come out with a solution so we can post the new script on this site for members to use as well.
TangLung
06-02-2003, 09:41 PM
Thanks a million, Dave! You just saved my project ! I owe you big time !
One last thing, though...
"How do I get the images to show at the center?"
As I understand it, when you use the document.write, there is no way of putting the results at the center? Images are displayed on the left always.
In my 1st downloaded script (Random Image Swap without links), I used the <p align="center"> to place images at the center. That was easy ! But, when I tried using it on the 2nd script (Random Image Swap with links) with the document.write, I can't seem to position it at the center.
I'm sorry, Dave, but I'm not yet really into this javascripting thing. I'm learning, though... bear with me.
Thanks in advance!
Put this around your code..
<div align="center">
<script type="text/javascript">
<!--
/* CODE */
//-->
</script>
</div>
Jona
I hope I didn't butt in..
Jona
TangLung
06-03-2003, 12:30 PM
Thanks for all the help, Dave! Script is running perfectly.
Jona, I appreciate you dropping by. No prob !
More power to this forum !
All credit goes to Dave. ;)
Jona