D
Dylan Parry
Hi,
What I am trying to do is get an event to fire when, and only when, a
particular element is in view on a page.
What I have is DIV element that acts as a viewport, which contains
several other absolutely positioned elements - let's assume these are
simply more DIV elements that are squares. The main DIV has its position
set to relative, and its overflow property set to "auto", so there are
scrollbars that allow you to "move around" the contents within the DIV.
When it first appears, several of the elements within the main DIV are
out of view.
What I now want to do is set some properties for these elements, for
example assign a background image. As some are obscured from view, I
don't want to change these properties until they are actually visible
within the main DIV. This is essential as I could end up with dozens of
elements that aren't actually visible at the beginning of the process,
but as the user scolls the main DIV, they will come into view - I don't
want to set the background image for all of the elements at once as this
would be a considerable waste of bandwidth if the main DIV is never
scrolled enough to see them, and also a waste of time doing it if the
element is never seen.
So basically, what I am looking for is a way of specifying an event that
should be fired when one of these elements comes into view so that I can
then assign all the necessary properties to that element and thus avoid
wasting bandwidth and also having to assign all the properties when the
page loads.
Does anyone have any ideas?
--
Dylan Parry
http://electricfreedom.org | http://webpageworkshop.co.uk
The opinions stated above are not necessarily representative of
those of my cats. All opinions expressed are entirely your own.
What I am trying to do is get an event to fire when, and only when, a
particular element is in view on a page.
What I have is DIV element that acts as a viewport, which contains
several other absolutely positioned elements - let's assume these are
simply more DIV elements that are squares. The main DIV has its position
set to relative, and its overflow property set to "auto", so there are
scrollbars that allow you to "move around" the contents within the DIV.
When it first appears, several of the elements within the main DIV are
out of view.
What I now want to do is set some properties for these elements, for
example assign a background image. As some are obscured from view, I
don't want to change these properties until they are actually visible
within the main DIV. This is essential as I could end up with dozens of
elements that aren't actually visible at the beginning of the process,
but as the user scolls the main DIV, they will come into view - I don't
want to set the background image for all of the elements at once as this
would be a considerable waste of bandwidth if the main DIV is never
scrolled enough to see them, and also a waste of time doing it if the
element is never seen.
So basically, what I am looking for is a way of specifying an event that
should be fired when one of these elements comes into view so that I can
then assign all the necessary properties to that element and thus avoid
wasting bandwidth and also having to assign all the properties when the
page loads.
Does anyone have any ideas?
--
Dylan Parry
http://electricfreedom.org | http://webpageworkshop.co.uk
The opinions stated above are not necessarily representative of
those of my cats. All opinions expressed are entirely your own.