Forums

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

Home Forums JavaScript Making header smaller size when not at top

  • This topic is empty.
Viewing 1 post (of 1 total)
  • Author
    Posts
  • #208570
    ccote
    Participant

    I am fairly new to using javascript to change CSS. I am working for a client who wants, in their mobile version, to have their sticky header’s height to shrink in half when they are not at the top of the main content. I also want all of the icons to shrink in half in both height and width. When the user scrolls back to the top of the page, the header should return to its normal size. I am new to this type of JS functionality, so any and all help would be greatly appreciated. I have created a responsive.js file with the sizes and I know how to add classes from this file to the divs I need. However, what is the best way to determine if the user has scrolled below the top (and make sure that it doesn’t add the class each time they scroll) or has reached the top of the main content?
    Any and all help is greatly appreciated.

    Chris

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