CodingForums.com - View Single Post

Old Pedant · 11-14-2012, 07:52 PM

The four images in the actual <img> tags are your original 4 images.

In the hovers array, there are 4 sub-arrays.

Each sub-array corresponds to the 4 images that you want to use as replacements when one of the original images is hovered over.

So, for example, when the user hovers over "nov1.jpg" (the first actual <img> tag), the replacements for *ALL FOUR* of them images come out of the FIRST sub-array:

Code:

    ["nov5.jpg","nov9.jpg","nov13.jpg","nov17.jpg"],

When the user hovers over "nov4.jpg" (the 4th actual <img>) the replacement come out of the 4th sub-array:

Code:

    ["nov8.jpg","nov16.jpg","nov20.jpg","nov12.jpg"]

So, in total, you should have 20 images. IT DOES NOT MATTER where the images come from.

It would be perfectly okay to have, for example

Code:

    <img src="http://www.picasa.com/77181bb181.jpg" alt="0" title="http://www.picasa.com/77181bb181" />

and yet have the sub-array images coming from a completely different site (or even sites):

Code:

    ["http://www.mysite.com/image/x.jpg", "y.jpg", "z.jpg", "http://www.codingforums.com/pictures/337.jpg" ],

Note only that if the image comes from the SAME SITE as the web page then you do NOT have to specify the full URL to the image (though it is perfectly okay to do so).

That's it.

If you don't have 20 images--if some of them are repeated for various reasons--that's fine. But you still need the 20 images "slots" as shown in the code.

p.s.: As you noticed that, indeed, my sub arrays just used

Code:

["nov18.jpg","nov14.jpg","nov10.jpg","nov6.jpg"],

The *BROWSER* automatically interprets those as the URLs

Code:

<img src="http://www.artsofsnohomish.org/nov12/nov18.jpg" .../>

simply because the page you are looking at has a base URL of

Code:

     http://www.artsofsnohomish.org/nov12/

so the images are *relative* to that base URL.

11-14-2012, 07:52 PM	PM User \| #7
Old Pedant Supreme Master coder! Join Date: Feb 2009 Posts: 23,178 Thanks: 59 Thanked 3,995 Times in 3,964 Posts	The four images in the actual <img> tags are your original 4 images. In the hovers array, there are 4 sub-arrays. Each sub-array corresponds to the 4 images that you want to use as replacements when one of the original images is hovered over. So, for example, when the user hovers over "nov1.jpg" (the first actual <img> tag), the replacements for ALL FOUR of them images come out of the FIRST sub-array: Code: ["nov5.jpg","nov9.jpg","nov13.jpg","nov17.jpg"], When the user hovers over "nov4.jpg" (the 4th actual <img>) the replacement come out of the 4th sub-array: Code: ["nov8.jpg","nov16.jpg","nov20.jpg","nov12.jpg"] So, in total, you should have 20 images. IT DOES NOT MATTER where the images come from. It would be perfectly okay to have, for example Code: <img src="http://www.picasa.com/77181bb181.jpg" alt="0" title="http://www.picasa.com/77181bb181" /> and yet have the sub-array images coming from a completely different site (or even sites): Code: ["http://www.mysite.com/image/x.jpg", "y.jpg", "z.jpg", "http://www.codingforums.com/pictures/337.jpg" ], Note only that if the image comes from the SAME SITE as the web page then you do NOT have to specify the full URL to the image (though it is perfectly okay to do so). That's it. If you don't have 20 images--if some of them are repeated for various reasons--that's fine. But you still need the 20 images "slots" as shown in the code. p.s.: As you noticed that, indeed, my sub arrays just used Code: ["nov18.jpg","nov14.jpg","nov10.jpg","nov6.jpg"], The BROWSER automatically interprets those as the URLs Code: <img src="http://www.artsofsnohomish.org/nov12/nov18.jpg" .../> simply because the page you are looking at has a base URL of Code: http://www.artsofsnohomish.org/nov12/ so the images are relative to that base URL. __________________ An optimist sees the glass as half full. A pessimist sees the glass as half empty. A realist drinks it no matter how much there is.