Как вернуть скролл на изначальную позицию после повторного нажатия на тот же класс?
Набросал простенький код. При нажатии на .js-o-card срабатывает прокрутка к блоку с классом .active-card. Как мне сделать возвращение скролла на изначальную позицию? Знаю, что нужно записывать текущею позицию скролла, но не знаю как это реализовать кодом...
$(document).ready(function () {
$('.js-o-card').click(function () {
$(this).toggleClass('active-card');
$('html,body').animate({scrollTop: $(".active-card .thumbnail").offset().top - $(window).height()/3}, 1000);
});
});
UPD 07-08 8-52 Изменил код, но в исходное состояние не возвращает. Остальное работает. Подскажите, что я делаю не так?
$('.js-o-card').on('click', function () {
var $window = $(window);
if (!$(this).hasClass('active-card')) {
$(this).addClass('active-card');
console.log('первый однако');
$('html,body').animate({
scrollTop: $(".active-card .thumbnail").offset().top - $(window).height() / 3
}, 1000);
$window.scroll(function () {
localStorage.setItem('scrollPosition', $window.scrollTop())
})
} else {
$(this).removeClass('active-card');
console.log('второй однако');
window.scroll(0, localStorage.getItem('scrollPosition') | 0)
}
});
UPD 07-08-21 16-32
var scrollPosition = null;
$('.js-o-card').on('click', function () {
var $window = $(window);
if (!$(this).hasClass('active-card')) {
$(this).addClass('active-card');
console.log('первый однако');
$('html,body').animate({
scrollTop: $(".active-card .thumbnail").offset().top - $(window).height() / 3
}, 1000);
$window.scroll(function () {
scrollPosition = $window.scrollTop();
})
} else {
if (scrollPosition) {
window.scrollTo(0, scrollPosition);
scrollPosition = null;
}
$(this).removeClass('active-card');
console.log('второй однако');
}
});