The Lodge is members-only design/dev videos and Office Hours.

Next Office Hours Session: "Implementing an SVG Icon System" Nov 30 - 6:00 PM Eastern

Is there a way to override jQuery offset when using media queries?

  • # April 17, 2013 at 4:47 am

    Hi guys,

    I have the following problem. I am using a single page design and use jQuery to get an offset of -85. It works for the larger screens, but as soon as I apply the media queries, the headers on each page disappear. What is the correct way to sort out the issue? CSS/JavaScript…. and where on planet Earth do I begin?

    $(‘.scroll’).click(function(event) {

    var full_url = this.href;

    var parts = full_url.split(‘#’);
    var trgt = parts[1];

    //var target_offset = $(‘#’+trgt).offset();
    var target_offset = $(‘#’+trgt).offset();
    var target_top = -85;

    //add the magic
    $(‘html, body’).animate({scrollTop:target_top}, 500);


    $(‘nav#navigation a’).click(function(){
    $(‘nav#navigation a’).removeClass(‘active’);

    # April 17, 2013 at 4:48 am

    Let me know if you require the demo url (it’s still a working progress – so it’s not done as yet)

    # April 17, 2013 at 2:52 pm

    codepen plz

Viewing 3 posts - 1 through 3 (of 3 total)

You must be logged in to reply to this topic.

There's a whole bunch of content on CSS-Tricks.

Search for Stuff   •   Browse the Archives

Get the Newsletter ... or get the RSS feed