The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums JavaScript Header of the section you are currently reading;

  • This topic is empty.
Viewing 3 posts - 1 through 3 (of 3 total)
  • Author
  • #31514

    I have been playing around with some jQuery* as part of a larger idea in my head.

    I needed to display the text of a ‘h1’ element based on the location of the readers view-port.

    I have a working example here:

    My question? is this the most efficient/robust way of achieving this goal? (View the source for the script)

    I originally had the script collect the position of each ‘h1.title’ elements and compared them to the window position every time the window scrolled. I decided that this was too much for every ‘.scroll()’ call, and changed it to setting up an indexed array of position values, and looped through that instead.

    I know that if anything changes on the page (AJAX loading of extra content, etc.) I will have to re-run the ‘createTitleArray()’. I figured doing that every now and then is better than repeating it on EVERY scroll event.

    * IMO the jQuery overhead is minimal, and I’ll be using it for other scripts no-doubt!

    My larger idea may be used to highlight a position in a menu whilst reading, although it is a definite start for me :-) .


    I can’t think of a better way of doing it.

    Note: It doesn’t work properly with the last h1.title.


    Good shout on the last ‘h1.title’ – I will look into that…

    Fixed it – the array didn’t have any further items to compare the last ‘h1.title’ to. Used the ‘html’ height as a last index.

Viewing 3 posts - 1 through 3 (of 3 total)
  • The forum ‘JavaScript’ is closed to new topics and replies.