PDA

View Full Version : I need help with JavaScript and random images

trikota
09-20-2002, 09:17 AM
Hi,

I need to have a place were 6 different images will load that you can click on and have a pop-up. The popups need to of a certain size. It's even ok if they are the same size. ALthough it would have been better if they are dependent on the image size.

ALso, the random images are not just a smaller versions of the pop-up image.

PLease, help
Mr J
09-20-2002, 03:37 PM
Have a play with this to start with and we'll take it from there.

Change the images to your own images.



<script>
images=new Array()
images[images.length]="epic1.gif"
images[images.length]="epic2.gif"
images[images.length]="epic3.gif"
images[images.length]="epic4.gif"
images[images.length]="epic5.gif"
images[images.length]="epic6.gif"

function next_image(){
i=Math.round(Math.random()*images.length-1)
img1.src=images[i]
}

function bigone(){
img2.src=images[i+1]
}
</script>

<P><a href="javascript:next_image()">Next Image</a>
<P><img src="epic0.gif" name="img1" onclick="bigone()">
<P><img src="epic0.gif" name="img2" width=300 height=300>
beetle
09-20-2002, 03:46 PM
Mebbe somthing like this?<script>
var imageData = [
['pic1.jpg','pic1_sm.jpg','300','200'],
['pic2.jpg','pic2_sm.jpg','400','450'],
['pic3.jpg','pic3_sm.jpg','200','500'],
['pic4.jpg','pic4_sm.jpg','350','350'],
['pic5.jpg','pic5_sm.jpg','600','400'],
['pic6.jpg','pic6_sm.jpg','250','200'],
['pic7.jpg','pic7_sm.jpg','540','420'],
['pic8.jpg','pic8_sm.jpg','320','380']
];
var imgRoot = "/images/";
var picked = new Array();
for (var i=0; i<imageData.length; picked.push(0), i++);

function showPopup(i) {
var f = 'width=' + imageData[i][2] + ',height=' + imageData[i][3];
window.open(imgRoot+imageData[i][0],'picWin', f);
}

function insertRandomImgs(qty) {
var p = 0;
while (p < qty) {
var i = Math.floor(Math.random() * imageData.length);
if (picked[i] == 0) {
document.write('<img src="'+imgRoot+imageData[i][1]+'" style="cursor:hand" alt="'+imageData[i][0]+'" onClick="showPopup('+i+')">');
picked[i] = 1;
p++;
}
}
}
</script>
</HEAD>

<BODY>
<script>
insertRandomImgs(6);
</script>
trikota
09-21-2002, 07:14 PM
Thank you, guys.

I used the code from Beetle and it works great with few changes.
I am just learning JS and it was a great help.