Forums

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

Home Forums CSS Responsive CSS help

  • This topic is empty.
Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • #44176
    Archie22is
    Participant

    Hey guys,

    I popped a question earlier without a proper example. I use the following script to get an offset from the fixed header and the website body:

    http://codepen.io/Archie22is/pen/vBqin

    It works fine on larger displays. My problem starts from the moment you move to smaller screens.

    The site if not done as yet – here is the link: bit.ly/17G5m7m

    How will one go about fixing the offset margin to vary according to the different media queries?

    #132100
    Paulie_D
    Member

    This is the scroll to top item, yes?

    In that case, I’d lose it completely for scrolling devices. People will just swipe/scroll/slide anyway.

    #132102
    Archie22is
    Participant

    Hi Paulie_D,

    Thank you for the reply. No, not the scroll to up – that I will sort out on mobile devices later.

    What I meant is when clicking on the menu item, it takes you (scrolls) to the menu item on the page. It correctly takes you to the correct page on a big screen but on smaller screens (tablets, mobile devices, etc) it misses the page section because of the offset set in the jQuery.

    I want to find out if there is a way to adjust the offset for each of the different layouts?

    #132109
    Paulie_D
    Member

    I’m no expert in JS but can’t you set/get the height of the header as a variable (plus or minus whatever) and use that instead?

    #132112
    Archie22is
    Participant

    Paulie_D… I don’t see the reason why that shouldn’t work. I will be back to compliment you and crown you a genius – lemme get back to work :-)

    #132129
    Archie22is
    Participant

    Paulie_D… you are a GENIUS!!!

    [RESOLVED]

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