Well I dont think this can be done, its like agains browser
functionality. I mean if images are there its ebcause they should be
requested

If you want to swaping then I dont know, I would do soemthing like
( just thiking )

having a hrefs with the data?

width="100" height="100" alt="image
description"

<a href="http://www....";  rel="{width:100, height:100, alt:'image
description}" />
<a href="http://www....";  rel="{width:200, height:200, alt:'image
description2}" />

And having javascript create the IMG element once the thumb is clicked
by getting the information from the href.

that way you have semi-organized HTML and no server requests.



On 27 mayo, 19:13, Matt Thomson <[email protected]> wrote:
> It seems to me the two example above do not work by any inline
> styling, but by adding a domready event that grabs the required images
> as an array, loops through them, grabs the src (in another array),
> then sets the src to null, (or a blank gif etc).
>
> This way the browser does not load anything, as the src is '' or null,
> or it loads a blank gif. Then the real src array is in memory, to load
> the images when required, by resetting the src.
>
> If this is the case, I can see how it would work, although I think
> JSON may be just as good, as setting an image src to '' or a blank gif
> doesn't seem like a "proper" scalable way to do it, but a bit more of
> a hack. Thanks for the links though, I like to see how others have
> approached the problem.
>
> On May 27, 11:32 pm, Oskar Krawczyk <[email protected]> wrote:
>
> > Well, doesn't work for you, but it works for me (as I've explained above_.
> > Please take a look at the link provided, run Firebug (turn ON the cache),
> > you'll see 5 images are being loaded, asynchronously. The way I'm preventing
> > them to load initially is by hiding them. This is essentially lazy-loading
> > them.
>
> >http://blog.olicio.us/public/weblog/MooImagePreload/
>
> > O.
>
> > __
>
> > Oskar Krawczykhttp://nouincolor.com
>
> > On Wed, May 27, 2009 at 12:16, Matt Thomson <[email protected]> wrote:
>
> > > As I said in my first post:
>
> > > "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. "
>
> > > This happens in all browsers.
>
> > > On May 27, 10:35 pm, Oskar Krawczyk <[email protected]> wrote:
> > > > Using fake filenames is a really bad idea as it'll throw a 404 while
> > > > requesting the file, ergo a slower response time.
>
> > > > What I usually do (http://blog.olicio.us/public/weblog/
> > > > MooImagePreload/) is put a inline style, like "visibility: hidden"
> > > > which forces the user-agent not to load the images but put IMG
> > > > placeholders instead (rememer to turn ON your cache before testing
> > > > this solution). Then, remove the styles when needed.
>
> > > > Oskar
>
> > > > Sent from my iPhone
>
> > > > On 27 May 2009, at 05:29, "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.

Reply via email to