I have been encountering a problem from sometime now.Looked up with similar problems on stackoverflow.But none could help me.
Problem is that my html page is jumping, when i scroll it. If the content is less than the total height of the page, it doesnt jump, but as the content go little bigger than the total height of the page it starts jumping
What are the possible solution, if anyone could help me a bit. Thanks in advance.I am using bootstrap.
html
<body>
<nav class="navbar navbar-default navbar-fixed-top" role="navigation">
<div class="navbar-header">
<a class="navbar-brand" rel="home" href="/welcome">
<img src="/resources/images/senabLogo.jpg">
</a>
</div>
<!-- navbar-header -->
<div class="collapse navbar-collapse">
<ul class="nav navbar-nav">
<li><a href="/welcome">Home</a>
</li>
<li><a href="/offers">Offers</a></li>
<li><a href="/settings">Settings</a></li>
<li class="dropdown menu-item">
<a href="#" class="dropdown-toggle" data-toggle="dropdown">Language</a>
<ul class="dropdown-menu">
<li><a href="?language=en">EN</a></li>
<li><a href="?language=sv">SV</a></li>
<li><a href="?language=no">NO</a></li>
</ul>
</li>
</ul>
<!-- nav navbar-nav -->
<div class="col-sm-3 col-md-3 pull-right">
<ul class="LoginDetailsH">
<li>Sales</li>
<li><a href="javascript:formSubmit()">Log out <span class="fa fa-sign-out"> </span></a></li>
<li class="dropdown menu-item pull-right">
<a href="#" class="dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"><span class="fa fa-question-circle"> </span></a>
<ul class="dropdown-menu">
<li><a href="https://intranet.senab.com/diskussioner/categories/listings/fsvb" target="_blank">View open and closed questions</a></li>
<li><a href="https://intranet.senab.com/diskussioner/ask/sales-to-cash/fsvb" target="_blank">Ask a new question</a></li>
</ul>
</li>
</ul>
<!-- LoginDetailsH -->
</div>
<!-- col-sm-3 col-md-3 pull-right -->
</div>
<!-- collapse navbar-collapse -->
</nav>
<div class="container">
</div>
</body>
CSS
.navbar-fixed-top {position:relative !important;}
I have referrd to the foloowing
Prevent page from jumping while changing position of element on scroll function
How do I stop a web page from scrolling to the top when a link is clicked that triggers JavaScript?
