I have below code already and working well to scroll down to the ID ('expressRate') on page loading. But with change of requirement the page should scroll down to a point 50 pixels above the div ID 'expressRate'. Any help would be appreciated.

 $location.hash('expressRate');
 $anchorScroll();

I have below code already and working well to scroll down to the ID ('expressRate') on page loading. But with change of requirement the page should scroll down to a point 50 pixels above the div ID 'expressRate'. Any help would be appreciated.

 $location.hash('expressRate');
 $anchorScroll();

• javascript
• jquery
• angularjs

• Get the vertical api.jquery./offset , subtract 50, and api.jquery./scrollTop/#scrollTop2 the window down to it. – Taplar Commented Dec 4, 2018 at 15:15

3 Answers 3

try this javascript code after you scroll to the tag 'expressRate'

window.location('#expressRate');
window.scrollBy(0,-50);

//get the element
var $expressRate = $('#expressRate');
//get the vertical distance of the element from the top of the page
var verticalPositionOfElement = $expressRate.offset().top;

//added a timeout just so you could see the start and then the
//adjustment
setTimeout(function () {
  //scroll the window down the element distance, minus whatever
  $(window).scrollTop(verticalPositionOfElement - 50);
}, 1000);

html, body {
  min-height: 5000px;
}

#expressRate {
  min-height: 200px;
  margin-top: 1000px;
  background-color: red;
}

<script src="https://cdnjs.cloudflare./ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="expressRate">

window.scroll(0,findPos(document.getElementById("expressRate")) - 50);

    function findPos(obj) {
        var curtop = 0;
        if (obj.offsetParent) {
            do {
                curtop += obj.offsetTop;
            } while (obj = obj.offsetParent);
        return [curtop];
        }
    }