scrollTop() not working after applying overflow values with jQuery?

Question

I'm using Chris Coyier's plugin (actually, it is a modified version by Devin Sturgeon) to animate scrolling to anchor links:

// Easing for links pointing to anchors
$(document).ready(function() {
  $('a[href*=#]:not([href=#])').click(function() {
    if (location.pathname.replace(/^\//,'') == this.pathname.replace(/^\//,'') && location.hostname == this.hostname) {
      var target = $(this.hash);
      target = target.length ? target : $('[name=' + this.hash.slice(1) +']');
      if (target.length) {
        $('html,body').animate({
          scrollTop: target.offset().top
        }, 1000);
        return false;
      }
    }
  });
});

It works perfectly until I apply overflow values with jQuery. For example, after I close a modal window, this piece of code is in charge of hiding horizontal overflow and setting vertical overflow to auto:

$('.file-content a.close-reveal-modal').on('click', function() {
  $('html, body').css({
    'overflow-y' : 'auto',
    'overflow-x' : 'hidden'
  });
});

After those values are applied, the plugin to animate scrolling to anchor links stops working, clicking on them doesn't produce any result whatsoever. If I remove the code in charge of setting the overflows when closing a modal, Chris' plugin works like a charm every single time.

Why is this happening?

Any sort of help will be very much appreciated!

Did you figure this out?

arao6
– arao6

2015-12-30 18:07:18 +00:00
Commented Dec 30, 2015 at 18:07 — arao6
– arao6, Commented Dec 30, 2015 at 18:07

user3666197 · Accepted Answer · 2014-10-08 03:48:02Z

2

I don't know if this could help you, but here is a hint that I have found: http://upshots.org/javascript/jquery-get-real-height-of-hidden-or-overflow-hidden-elements

Did you try to debug it?

Because I suspect that in your example

target.offset().top

returns zero

edited Oct 8, 2014 at 3:48

user3666197

1

answered Sep 27, 2014 at 16:21

Beri

11.6k4 gold badges38 silver badges59 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

user3666197 Over a year ago

You might want to know, Beri, that Stackoverflow Netiquette discourages from using a URL-link derrogated posts. Rather include the merit here, in your post, once the referred page(s) need not be persistent forever so as to still provide your intended content. You might want to re-read the StackOverflow Do-s and Don't-s and re-edit your post to both show your will to comply with the Community Netiquette and also to avoid any adverse step from any Moderator who may feel necessary to enforce the said rules. Enjoy the great Community of contributing members you have decided to belong to.

Collectives™ on Stack Overflow

scrollTop() not working after applying overflow values with jQuery?

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related