What I want is to have a lot of data about the large images/ lightbox images, i.e the src is this, the width is this, the height is this (and maybe later) the alt tag is this.....
This data could be given to the browser like this: <img src="http://www...." width="100" height="100" alt="image description" /> <img src="http://www...." width="200" height="200" alt="image description2" /> it could be in json, something like: var myJSONObject = {"images": [ {src": "http://www....", "width": "100", "height": "100", "alt": "image description"}, {src": "http://www....", "width": "200", "height": "200", "alt": "image description2"}, ] }; Either way I want to be able to get a lot of data in the script about the image, I don't want to do a nasty swap. This would work fine in json, so I already know how to do it in javascript. My question is more "can it be done by putting the images in the html, without requesting the image". On May 27, 5:39 pm, "Steve Onnis" <[email protected]> wrote: > Why? Just replace the values in the src > > So if you have /images/thumbs/images.jpg you could do > > largeSrc = image.src.replace('thumbs', 'large') > > Or what ever > > -----Original Message----- > From: [email protected] > > [mailto:[email protected]] On Behalf Of Matt Thomson > Sent: Wednesday, 27 May 2009 2:51 PM > To: MooTools Users > Subject: [Moo] Re: Putting the images in the html, but stopping the browser > from requesting them? > > They are exactly, the same. I could just get the thumbnail names, and > know the folder of the big and lightbox images, and do a loop through > the thumb src's and concatanate some strings for the large img src. > But then I want to know the width/height of the big image and lightbox > images (before they are injected). > > Ideally I want the code to be cleanly written and expanable, so I > could put an alt tag in, and grab it with mootools etc. > > All this is possible with json, and if I can't put the images in the > html, I think json is better that doing some nasty concatanations. But > if html is possible, it seems it is better than json, as all my > (changing) data is in one place. > > On May 27, 4:39 pm, "Steve Onnis" <[email protected]> wrote: > > How similar are the thumbnail file names to the larger image filenames? > > > -----Original Message----- > > From: [email protected] > > > [mailto:[email protected]] On Behalf Of Matt Thomson > > Sent: Wednesday, 27 May 2009 2:37 PM > > To: MooTools Users > > Subject: [Moo] Re: Putting the images in the html, but stopping the > browser > > from requesting them? > > > That would stop the images loading good, but I don't want 50 > > unnesscessary requests to the server. > > > I should also note that a big image click goes to a lightbox, so > > putting the big img src as the href of the thumb won't help. As I will > > still have the problem of getting the lightbox img src. > > > On May 27, 4:29 pm, "Steve Onnis" <[email protected]> wrote: > > > You could always do something sneeky like put an underscore in front of > > the > > > actual src value like.. > > > > src="_myImage.jpg" > > > > Then ammend the src value with javascript to load the image with the > click > > > > -----Original Message----- > > > From: [email protected] > > > > [mailto:[email protected]] On Behalf Of Matt Thomson > > > Sent: Wednesday, 27 May 2009 1:56 PM > > > To: MooTools Users > > > Subject: [Moo] Putting the images in the html, but stopping the browser > > from > > > requesting them? > > > > I have a photo gallery that will display about 50 thumbnails. When > > > thumbnail #1 is clicked, big image number 1 is displayed and so on... > > > > Ideally I would like to put all the thumbs in one div (as <img > > > src="..), and all the big images in another div (as <img src=".. > > > style="display; none" />) > > > > Then I could (with mootools) grab all the big images as an array > > > (getElements), grab the thumbs as an array, and do an each loop > > > through the thumbs. So if thumbsImageArray[index] is clicked on, > > > bigImageArray[index] is shown. > > > > All pretty simple, except that I don't want 50 big images to load > > > right away, and "display: none" does not stop the browser from > > > requesting them from the server. > > > > I am thinking I may have to make a seperate json bit, and load all the > > > big image info (src, width,height) as arrays/objects, then access > > > these arrays with the mootools. This would work, but ideally I would > > > love to have all my data nice and cleanly put in the HTML, do a > > > getElements, do an each loop, sorted. > > > > Does anyone know of a way to stop the browser requesting the image, > > > and still having the correct src in the html. I don't want an > > > incorrect src, as it will result in 50 unnesscessary server calls. > > > > Thanks, > > > > Matt.
