amal/dynamicweb
1
0
Fork 0
Code Issues Pull requests Projects Releases Wiki Activity

adjust padding on fixed .topnav on modal show/hide, to remove the movement

Browse source
This commit is contained in:
ARvind Tiwari 2017-08-09 01:26:02 +05:30
parent 34a95f5a05
commit 7bde3149f5
1 changed files with 40 additions and 0 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

40
hosting/static/hosting/js/initial.js
View file

@ -13,4 +13,44 @@ $( document ).ready(function() {
}, 1000);
});
});
function getScrollbarWidth() {
var outer = document.createElement("div");
outer.style.visibility = "hidden";
outer.style.width = "100px";
outer.style.msOverflowStyle = "scrollbar"; // needed for WinJS apps
document.body.appendChild(outer);
var widthNoScroll = outer.offsetWidth;
// force scrollbars
outer.style.overflow = "scroll";
// add innerdiv
var inner = document.createElement("div");
inner.style.width = "100%";
outer.appendChild(inner);
var widthWithScroll = inner.offsetWidth;
// remove divs
outer.parentNode.removeChild(outer);
return widthNoScroll - widthWithScroll;
}
// globally stores the width of scrollbar
var scrollbarWidth = getScrollbarWidth();
// add proper padding to fixed topnav on modal show
$('body').on('click', '[data-toggle=modal]', function(){
var topnavPadding = parseInt($('.navbar-fixed-top.topnav').css('padding-right'));
$('.navbar-fixed-top.topnav').css('padding-right', topnavPadding+scrollbarWidth);
});
// remove added padding on modal hide
$('body').on('hidden.bs.modal', function(){
var topnavPadding = parseInt($('.navbar-fixed-top.topnav').css('padding-right'));
$('.navbar-fixed-top.topnav').css('padding-right', topnavPadding-scrollbarWidth);
});