Home/ Questions/Q 8635217
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-12T09:55:15+00:00

I have a DIV which is of a fixed width/height, is Overflow: Hidden and

  • 0

I have a DIV which is of a fixed width/height, is “Overflow: Hidden” and contains a lot of IMGs which are “Display: Inline” and “Float: Left”

Obviously only the first few images are ‘visible’ – the rest disappear off into the ‘hidden’ area of what is a very, very wide DIV.

If this were a scrollable DIV with non-inline elements, I could easily implement a system whereby the IMGs don’t load their ‘src’ until they become ‘visible’ – but I can’t find a way of determining the ‘real’ position of inline’d and float:left’d images – e.g. there’s no way to tell if they’re in the ‘visible’ part of the DIV?

Any ideas? Things like Offset and CSS Left/Top are all 0 (obviously)??

p.s. to enhance the question – what I want to do (in jQuery because I think in that!) is

$("#container img").each(function() {
  if ($(this).isinthevisiblepartofthecontainer) ...
});

p.p.s. it occurs to me that I could just ‘count widths’ – assuming I can get the elements in order – so something like this

var width = $("#container").width();
var sofar = 0;
var imgs = $("#container img");
var idx = 0;
while (sofar < width) {
  var img = $(imgs[idx]);
  img.dowhatsoeverIwanthere
  sofar += img.width();
  idx++;
}

It’s crude but assuming it returns the elements in the right order (and it seems to) it would work…

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    After much investigation I’m concluding that you cannot determine whether FLOAT:ed elements are within the visible portion of a scrolling div via any attribute they may have.

    You can calculate their position by adding-up their widths/heights and then see if this ‘position’ is within the visible area but there’s no other way to determine their ‘visibility’.

    Not entirely surprising – they’re dynamically layed-out for a reason – and it’s not hard to calculate their position…

    • 0