Div with scrolling images

Question

Having a scrolling div that contains images with remote source.

when I scroll down or up each time images take time to load from its source how can I prevent that ?

Here is my div styling which contains list of images

.scrollingdiv {
height: 270px;
background-color: white;
border-bottom: 1px solid rgb(4, 180, 220);
overflow-x: hidden;
overflow-y: scroll;
}

and here is the html markup

<div class="scrollingdiv">
 <div class="seconddiv" style="height:350px; overflow:hidden;">
<ul>
<li> <img src="remotesource1"> </li>
<li> <img src="remotesource2"> </li>
<li> <img src="remotesource3"> </li>
</ul>
</div>
</div>

I hope to find a solution for that.

Can you create a fiddle illustrating your issue? It is hard to understand without more code — Benjamin Gruenbaum, May 08 '13 at 23:20
@RemonAmin Is "remoteSource1", "remoteSource2", etc. a reference to a picture, e.g. "remoteSource1.jpg" - or is this a reference to a PHP/JSP/ASP/ASPX script? — Mark Bertenshaw, May 08 '13 at 23:28
its src for image .,..I am creating jsfiddle now ,,I think its more better to demonstrate — Remon Amin, May 08 '13 at 23:29
on jsfiddle its working great but on my site in spite I am using the same code its not working and images fadout out when scrolling and show after i stop scrolling — Remon Amin, May 08 '13 at 23:36
I knew the problem now it was the image float ,,thanks all for help — Remon Amin, May 08 '13 at 23:41
google for `jQuery preload images` and you will find many resources — TheVillageIdiot, May 08 '13 at 23:48
here is a similar issue with a solution: http://stackoverflow.com/a/476681/1807551 — carrabino, May 09 '13 at 00:18

score 0 · Answer 1 · answered May 08 '13 at 23:42

0

The problem is in image float css removing float solved the problem

answered May 08 '13 at 23:42

Remon Amin

1,506
2
19
44

Div with scrolling images

1 Answers1