@David: yes, I know the script, I have a similar script (I also commented back then on your post). But I'm testing this in Firefox.
@Ryan: I saw it, have done such loaders as well.. but it's different as the thing that is loaded (at the bottom) is actually not on the page to begin with I overlooked the fact that webkit ignores it anyway, so it's better to approach my goal differently anyway; it's for a file manager and images are in "folders" which are basically small div rectangles that hold the images for that folder. When you open a folder (e.g. dblclick) the div opens to scrollheight and reveals the images. I can then fire an event that starts loading/displaying the images contained in that folder. Ok, even though this other approach might be better, there's still the question if this image lazyloading (replacing img.src ondomready with a spacer or spinner gif) atually works or is just a visual fx. @David, have you actually tried yours with 100 images and checked what the Net>Images tab in Firebug shows? On Oct 29, 9:14 pm, Ryan Florence <[email protected]> wrote: > Here's a different approach that can accomplish a similar goal: > > http://moodocs.ryanflorence.com/RpFlo/LazyPagination > > Instead of just images, it'll load entire pages of html as the user > scrolls down. So instead of rendering it all on the page, just render > the first couple pages with a normal pagination design. As they > scroll, it makes requests for the next page. > > Might not be what you need, but I'm finding it very helpful. > > Ryan Florence > > [Writing TextMate Snippets] (http://blog.flobro.com/) > > On Oct 29, 2009, at 1:38 PM, davidwalsh83 wrote: > > > > > > > Hello Rolf -nl, > > > I have a lazyload script here: > > >http://davidwalsh.name/lazyload > > > Unfortunately Webkit-based browsers continue the request even if you > > attempt to prevent the browser from doing so during the DOMREADY > > event. > > > David > > > On Oct 29, 2:32 pm, Rolf -nl <[email protected]> wrote: > >> Ok, that's what I thought; the html is loaded, but not yet all the > >> images.. so with the domready I kill the process. > >> But I do see 300+ requests to the images (and thus, it takes a long > >> time for the page to load). I should maybe put up some test page... > > >> On Oct 29, 6:20 am, Ryan Florence <[email protected]> wrote: > > >>> domready just means the html is loaded, it doesn't care about > >>> rendered > >>> image sizes. > > >>> Ryan Florence > > >>> [Writing TextMate Snippets] (http://blog.flobro.com/) > > >>> On Oct 28, 2009, at 4:51 PM, Mikhail Korobov wrote: > > >>>> No, domready means that DOM is ready and images are rendered. For > >>>> example, browser have to download image to set it's width and > >>>> height > >>>> and DOM can't be ready until widths and heights of all elements are > >>>> set. > > >>>> I think you should hide images using css and show them after > >>>> loading. > >>>> There also should be some graceful degradation plan for users > >>>> without > >>>> js, maybe putting all images in <noscript> in visible state or > >>>> something like that. > > >>>> On 29 окт, 02:21, Rolf -nl <[email protected]> wrote: > >>>>> Hello, > > >>>>> I wonder if these lazyload scripts that target images work > >>>>> really?! > >>>>> For example, I have a page with 300 images. I pull the filenames > >>>>> out a > >>>>> database and put them all on the screen. > >>>>> I have a domready function that collects all images and set > >>>>> their src > >>>>> to a spacer.gif > >>>>> When I then look at the Net > Images tab in Firebug, I still see > >>>>> 300 > >>>>> requests to those (original) images and it takes an awful lot of > >>>>> time > >>>>> to load the page. > >>>>> In the end the images are replaced on screen with the spacer > >>>>> gif, but > >>>>> I didn't win much time here. > > >>>>> At first I wondered if it was my php script that made a > >>>>> thumbnail of > >>>>> the original image which for outputted (e.g. <img src="image.php? > >>>>> file=blabla.jpg&size=....), but when I left that out and set the > >>>>> original image file as src, it didn't make any difference. > > >>>>> Ehmm, am I missing something here or..? I was expecting that > >>>>> domready > >>>>> event that replaced img.src with the spacer would prevent or cut > >>>>> off > >>>>> the loading of the original image...
