Well you can do this using jQuery's lazy image load tool... This is great and just fit your needs.
http://www.appelsiini.net/projects/lazyload
Lazy Load is a jQuery plugin written in JavaScript. It delays loading of images in long web pages. Images outside of viewport (visible part of web page) wont be loaded before user scrolls to them. This is opposite of image preloading.
Using Lazy Load on long web pages containing many large images makes the page load faster. Browser will be in ready state after loading visible images. In some cases it can also help to reduce server load. (Above is taken from the site)
For demo pls visit this page and you would know that this is the thing you are looking for.
This is an easy to integrate stuff so fit your needs.
To make it in Datalist or repeater you can do this using
<asp:Image ID="LazyImages" runat="server"
CssClass="lazy" src="img/BlankImage.gif" data-original="<%# Eval("URLofImageFromDB"))%>" />
You need to concentrate on CssClass and SRC attribute while binding and rest is taken care by jQuery.
Configuration of JQuery is important.
与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…