How do i load a image on the same page ?

[croft]

I want to load an image on the same page.. Hmm

Check this site out and how the screenshots work and you know what i mean.
http://www.eve-online.com/screenshots/collection.asp?col=24112004&n=10

I want t5o have small thumbnails belove a larger image. When i klick one of the smaller thumbnails i want it to load over them..

Im guessing some java script or something ?

[autocrat]

JS files...external....2......

1. x-core....cross platform browser JS.
2. minmax....makes IE accept the min/max height properties JS.

JS script....internal......lots....

the one you want.....(2 parts)

(part1_____the JS that does all the work!)

<script language="javascript">
    function screenup(n){
        screenow = window.open('/screenshots/up.asp?col=24112004&n='+n,'screenow','width=790,height=574,resizable=no,scrollbars=no,menubar=no,toolbar=no,directories=no,location=no,status=no');
    }
    function fcnDisplay(n){
        xGetElementById('displayImg').src = '/screenshots/24112004/'+n+'n.jpg';
    }
    function EVE_preloadImages() {
        var d=document; if(d.images){ if(!d.EVE_p) d.EVE_p=new Array();
        var i,j=d.EVE_p.length,a=EVE_preloadImages.arguments; for(i=0; i<a.length; i++)
        if (a[i].indexOf("#")!=0){ d.EVE_p[j]=new Image; d.EVE_p[j++].src=a[i];}}
    }
    document.onload = EVE_preloadImages('02n.jpg, 03n.jpg, 04n.jpg, 05n.jpg, 06n.jpg, 07n.jpg, 08n.jpg, 09n.jpg, 10n.jpg');
</script>

(part 2_____The code to call the JS... note the '##' for fcnDisplay + screenup !!!)

<td align="center"><a href="#sh" onclick="fcnDisplay('01')"><img src="24112004/01m.jpg" class="thumbs"></a><br><a href="#sh" onclick="screenup('01')"><img src="/bitmaps/img/fullscreen.gif" border="0"></a></td>

Is that any help ?

PLEASE NOTE...code is pasted as an example!
It is by no means meant asa breach of Copyright, nor to be copied.

[DaveSW]

or you can use my simple accessible iframe implementation
http://www.emdevelopments.co.uk/demo/iframe/

Replace the numbers with your pictures.

[Killer_Typo]

I want to load an image on the same page.. Hmm

Check this site out and how the screenshots work and you know what i mean.
http://www.eve-online.com/screenshots/collection.asp?col=24112004&n=10

I want t5o have small thumbnails belove a larger image. When i klick one of the smaller thumbnails i want it to load over them..

Im guessing some java script or something ?

that would be javascript such as

<script language="javascript">
function ChangeImage1(){
	document.getElementById("image1").src= "location of the first thumbnail";
}
		</script>

will work.

so your code might be

<img src="location of image" id="image1"> <!--this is the main image that you want swapped with other images

and below it would be the images you want in thumb view

<img src="loaction of the thumbnail" onClick="ChangeImage1();">

or

<img src="location of the thumbnail" onmousover="ChangeImage1();">

this can easily be added to add more functions for more pictures

IE:

<script language="javascript">
function ChangeImage1(){
document.getElementById("image1").src= "location of the first thumbnail";
}
function ChangeImage2(){
document.getElementById("image1").src= "locatoin of the second thumbnail";
}
</script>

then for subsequent loads for different images you would do

<img src="location of the image" onmouseover or onclick ="changeimageX();>

where X is the number of the corresponding thumbnail.

if thats confusing i can give you some sample code i have at home to look at.

I currently dont have any on me as i am at school.

[Nightjar]

this can easily be added to add more functions for more pictures

I followed this thread and I believe there is just a tiny bit to add to the script to let me do what I'm trying to do.
[img]http://www.cartabianca.com/test/progetto-web.gif[/img]
Basically, I'd like to click on one of the yellow buttons at the bottom to load a new image on the grey area. The button should also change into red, so to let people know which of the available images is being displayed.

Any help would be greatly appreciated!

[korigirl]

that would be javascript such as

<script language="javascript">
function ChangeImage1(){
    document.getElementById("image1").src= "location of the first thumbnail";
}
        </script>

will work.

so your code might be

<img src="location of image" id="image1"> <!--this is the main image that you want swapped with other images

and below it would be the images you want in thumb view

<img src="loaction of the thumbnail" onClick="ChangeImage1();">

or

<img src="location of the thumbnail" onmousover="ChangeImage1();">

this can easily be added to add more functions for more pictures

IE:

<script language="javascript">
function ChangeImage1(){
document.getElementById("image1").src= "location of the first thumbnail";
}
function ChangeImage2(){
document.getElementById("image1").src= "locatoin of the second thumbnail";
}
</script>

then for subsequent loads for different images you would do

<img src="location of the image" onmouseover or onclick ="changeimageX();>

where X is the number of the corresponding thumbnail.

if thats confusing i can give you some sample code i have at home to look at.

I currently dont have any on me as i am at school.

this actually is a bit confusing. can you show me an example please?

[MidiMagic]

Why bother with that?

Just make identical pages, with the color changes and the large picture coded differently, and with links to each other.

[korigirl]

Why bother with that?

Just make identical pages, with the color changes and the large picture coded differently, and with links to each other.

well I'm not sure exactly what you're talking about but I have a LOT of pictures to show (http://www.korigirl.com). Its my photography.

[autocrat]

Ok....This thread is almost 2 years out folks.

...Korigirl...
So you want to generate some sort of smart, clever, pretty gallery?
It's actually easier than you think - and for most things you can use CSS instead of JavaScript.
That said, do try to consider things such as Accessibility.
If you would like assistance, just PM or post here.

...MildMagic... Not particularly helpful? If I ask for directiosn to a library, what you gonna do, tell me to go to a books store and buy one instead ?
Not repremanding you (hell, I'm hardly ever here now adays), but please think first, type second.

[korigirl]

Thanks for offering but i think i'm happy with what I have right now. :)

[azzu5]

Hey...

Check out this page i used "highslide" javascript code here its very easy to use...

http://alsalamcity.net/alferdous/alferdous.htm

I hope this what you are looking for.

If you want script let me know...

Cheers....