В общем, открывается окно - в нем подгружаются посты - закрывается окно по клику/либо стрелкой браузера "назад"
После этого стрелка браузера "вперед" остается активной
Если нажать на нее, то ссылка просто изменится, но на пост этой ссылки не пройдет
Так меняется ссылка:
if(url != window.location){
window.history.pushState(null, null, url);
}
Так меняется ссылка обратно, по закрытию окна:
var window_location = window.location.href;
function Popupclose() {
}
А так закрывается окно по клику на кнопку "назад":
window.addEventListener('popstate', function(e) {
});
После этого волшебства, кнопка браузера "вперед" активна и может изменять ссылку без перехода по ней
Как осуществить один из вариантов:
- Кнопку "вперед" сделать не активной по закрытию попап
- Кнопку оставлять активной, а по клику по ней проходить на пост
- Кнопку, так же, оставлять активной, но по клику открывать окно с постом по имеющейся ссылке
Весь скрипт мадального окна:
spoiler
//ПОДГРУЗКА ПОПАП
function loadContents() {
var url = $('#page-nav a').attr('href');
if (url) {
$( ".popup-loader" ).show("slow");
$.ajax({
type: "GET",
url: url,
dataType: "html",
success: function (loaded) {
var result = $(loaded).find('#content_masonry .loop');
var nextlink = $(loaded).find('#page-nav a').attr('href');
$(loaded).imagesLoaded(function() {
$container.append(result).masonry('appended', result);
$('.popup-post-modal-open').bind('click', DimaPopup);
});
$( ".popup-loader" ).hide("slow");
if (nextlink != 'undefined') {
$('#page-nav a').attr('href', nextlink);
} else {
$('#page-nav').remove();
}
loading = false;
}
});
}
}
$('.popup-post-modal-open').bind('click', DimaPopup);
$('.popup-background').bind('click', Popupclose);
function DimaPopup(e){
e.preventDefault();
$('.popup-background').css('opacity', '1');
$('.popup-background').css('visibility', 'visible');
var url = $(this).attr('href');
// А вот так просто меняется ссылка
if(url != window.location){
window.history.pushState(null, null, url);
}
$('.popup-loader').fadeIn(100);
$('.popup-post').addClass('active');
window.setTimeout(function(){$('.popup-post').scrollTop(0);},50);
$('#content_owerflow').addClass('active');
$('body').addClass('active2');
$.ajax(
{
type : 'POST',
url : 'https://' + location.host + '/wp-admin/admin-ajax.php',
data: { action: 'popup_post', popup_post_id:$(this).parents('.title').children('.post-click-popup').children('span').text()
},
success: function(data){
$('.post-generat-content').eq(0).html(data);
$('.popup-loader').fadeOut(100);
$('.close').bind('click', Popupclose);
},
error: function(error)
{
console.log('Ошибка');
}
});
}
var window_location = window.location.href;
function Popupclose() {
$('.popup-background').css('opacity', '0');
$('.popup-background').css('visibility', 'hidden');
$('.popup-post').removeClass('active');
window.history.pushState(null, null, window_location);
$('#content_owerflow').removeClass('active');
$('body').removeClass('active2');
}
window.addEventListener('popstate', function(e) {
$('.popup-background').css('opacity', '0');
$('.popup-background').css('visibility', 'hidden');
$('.popup-post').removeClass('active');
$('#content_owerflow').removeClass('active');
$('body').removeClass('active2');
var url = $(this).attr('href');
if(url != window.history.back){
window.history.pushState(null, null, null);
}
});
Спасибо за внимание!
