Допустим вот пример:
https://codepen.io/Genri_Rus/pen/BaaWxYb
При клике на пункт меню без перезагрузки страницы точно также плавно сворачивать меню и показывать уже другую плавно выезжающую страницу ?
И подойдет ли такой вариант ?
$(function(){
const mainApp = $('.main-wrapper'); // получаем нашу обводку для контента
mainApp.on('click', '.menu li a', function(e){// при клике на пункт меню получаем путь до href
e.preventDefault();
History.pushState(null, document.title, $(this).attr('href'));
});
function loadPage(url) {
mainApp.css({opacity: 0.5});
mainApp.load(url + " .menu-wrapper > *", function(){
mainApp.css({opacity: 1});
});
}
History.Adapter.bind(window, 'statechange',function(e){
var State = History.getState();
loadPage(State.url);
});
});
Собственно куда нужно прописать все анимации, чтобы все происходило наиболее плавно ?
Простой
