show images after people scroll down the page - don't load them immediately after the page is loaded. also the images which are below the scroll should be first loaded when an user scrolls down. i need a javascript for that, but i don't want jquery! the code should be as short as possible. thank you.
Hi w47w47, Just like Google does on displaying its image search results? Interesting, I wonder how jQuery alone could do it . But as far as I know the native javascript, we couldn't possibly know the width and height of each images before loading. Logically, info on these width and height might be necessary to allocate "correct spaces" for each unloaded images, so that page layout stays still. Or, perhaps the use of ajax could help Hendra
Javascript has a scroll/onscroll event, you can register for scroll event and when scroll event trigger, you can sent a ajax request to server to get the images.
Hmm, maybe apply some logic and figure out a way to do so dude. You know those scripts that show a link to scroll up when you scroll to the bottom of the page. Just take than code and modify it. Instead of showing a link to scroll up, change the innerHTML of the empty div tags, and fill them with the image link Example: <div ="image1"></div> <div ="image2"></div> <div ="image3"></div> <div ="image4"></div> When scrolled down change the innerHTML of all those divs to <img src="image1.jpg"/>, <img src="image2.jpg"/>, <img src="image3.jpg"/>, <img src="image4.jpg"/>...... etc You can store those image HTML in an array on page load. This may seem like a hack or something but there are many ways to do what you wanna do. There is better more professional but this is what I'd do.