Как сделать правильные модальные окна на bootstrap 3, без смещения сайта по скролу.

Изначальный код модального

Вызов окна

<!-- Button trigger modal -->
<buttonclass="btn btn-primary btn-lg"data-toggle="modal"data-target="#myModal"> Кнопка открытия модали </button>

Внутренняя часть

<!-- Modal -->
<divclass="modal fade"id="myModal"tabindex="-1"role="dialog"aria-labelledby="myModalLabel"aria-hidden="true"><divclass="modal-dialog"><divclass="modal-content"><divclass="modal-header"><buttontype="button"class="close"data-dismiss="modal"aria-hidden="true">&times;</button><h4class="modal-title"id="myModalLabel">Название модали</h4></div><divclass="modal-body"> Я Модаль! </div><divclass="modal-footer"><buttontype="button"class="btn btn-default"data-dismiss="modal">Закрыть</button><buttontype="button"class="btn btn-primary">Сохранить изменения</button></div></div></div></div>

И чтобы скролл не прыгал добавляем такой js

$(".modal").on("show.bs.modal",function(){var $bodyWidth = $("body").width();
    $("body").css({'overflow-y':"hidden"}).css({'padding-right':($("body").width()-$bodyWidth)});});

$(".modal").on("hidden.bs.modal",function(){
    $("body").css({'padding-right':"0",'overflow-y':"auto"});});