Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 30.12.2016, 18:00
Новичок на форуме
Отправить личное сообщение для Lucia14 Посмотреть профиль Найти все сообщения от Lucia14
 
Регистрация: 30.12.2016
Сообщений: 2

Сохранить положение скролла при переходе по ссылке
Здравствуйте! Очень прошу помочь решить такую вот задачку.
Есть два дива (два "столбца") с overflow:auto, в одном из которых выводится список записей WP, а во втором диве выводиться полная статья. Задумка в том, чтобы при клике по записи в левом диве, она выводилась полностью в правом.

Все реализовал, осталось только сделать так, чтобы при клике по ссылке слева и переходе на новую страничку в диве слева скролл оставался на том же месте.

Собрал примерный план действий, но не могу его реализовать кодом ;(

1. Создаем обработчик события клика по ссылке
2. Получаем координаты текущего положения скрола и сохраняем их в localestorage
3. Перенаправляем пользователя по самой ссылке
4. На другой странице вешаемся на событие onload в обработчике
5. Извлекаем координаты прокрутки из localestorage
6. Прокручиваем скрол до нужной позиции.

Вот такая страница:
<?php
$getcat = get_the_category();
$cat = $getcat[0]->cat_ID;
?>

<div class="layer">
<?php if (have_posts()) :
query_posts('cat='. $cat);
while (have_posts()) : the_post();
?>

<h3><a href="<?php the_permalink(); ?>" name="<?php the_permalink(); ?>"><?php the_title(); ?></a></h3>
<?php the_excerpt();
endwhile;
endif;
wp_reset_query();
?>
</div>

<!-- Полный текст статьи -->
<div class="layer2">
<?php if (have_posts()) : while (have_posts()) : the_post(); ?>
<h3><?php the_title(); ?></h3>
<?php the_content(); ?>
<?php endwhile; ?>
<?php endif; ?>
</div>
Ответить с цитированием
  #2 (permalink)  
Старый 31.12.2016, 02:14
Новичок на форуме
Отправить личное сообщение для Lucia14 Посмотреть профиль Найти все сообщения от Lucia14
 
Регистрация: 30.12.2016
Сообщений: 2

Решил вопрос вот этими строками
<script>
window.addEventListener('DOMContentLoaded', function() {
var div = document.querySelector('.layer');
var scroll = localStorage.getItem('scroll')||0;
div.scrollTop = scroll;
div.addEventListener('scroll', function() {
localStorage.setItem('scroll', div.scrollTop);})});
</script>
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Ошибка при AJAX запросе при переходе на HTTPS "This request has been blocked.." WhiteFalke AJAX и COMET 1 27.12.2016 07:29
Подгрузка скролла при новом сообщении в чате AlexGraur AJAX и COMET 3 19.11.2016 18:40
Див при переходе по ссылке Andrejs Элементы интерфейса 6 27.04.2011 21:40
Текст, появляющийся в определённом месте страницы при клике по ссылке denisnb Элементы интерфейса 2 20.03.2011 07:24
Двойное действие при клике по ссылке spider Элементы интерфейса 5 10.11.2009 10:43