Greetings. Scrolling to anchor on jQuery is a very popular topic and I have a question about this. There is a code:

$('a[href^="#"]').bind('click.smoothscroll',function (e) { e.preventDefault(); var target = this.hash, $target = $(target); $('html, body').stop().animate({ 'scrollTop': $target.offset().top }, 500, 'swing', function () { window.location.hash = target; }); });

It works, everything is fine, everything is fine.

But how to make it so that when you press it, it scrolls to the anchor, but so that the anchor doesn't “get” 50 pixels for example?

There is an example of working code, how to add values ​​to scrolling, but on the contrary I need to reduce a little. Plus, I can change the minus, but I can hardly edit the first code.

  $(".scroll_down_1").click(function() { $('body').animate({ scrollTop: '+=' + 55 }, 'fast'); });

This is due to the fact that in Bootstrap navbar with fixed positioning and when scrolling to the anchor is performed, the anchor itself is not visible, it is closed by the navbar. The Google MDL is more thoughtful done. They made the header out of scrolling the main content and even if clicking on the anchor it will never be closed by the header.

Hope for understanding. I would be very grateful for the help.

    2 answers 2

     $('a[href^="#"]').bind('click.smoothscroll',function (e) { e.preventDefault(); var target = this.hash, $target = $(target); $('html, body').stop().animate({ 'scrollTop': $target.offset().top - 50 }, 500, 'swing', function () { window.location.hash = target; }); });
    • Super. Works. Thank! - gmastrbit
    • @Hinc, u ar velcom) Learn, we are waiting for more complicated tasks) - MedvedevDev
    • one
      @Hinc; Check the answer if it resolves your question - excellproj

    If the anchor on the input can be done like this, then the focus will be on your input and raise above the input.

     $('a.клас[href^="#якорь"]').bind('click.smoothscroll', function() { var target = this.hash, $target = $(target); $('html, body').stop().animate({ 'scrollTop': $target.offset().top - 350 // высота на которую нужно поднять выше }, 500, 'swing', function() { window.location.hash = target; }); });