Тема: Как сохранить позицию скролла? (Движок DCMS-Social/Общие вопросы)

-MiSHuTkA- (9 Nov 2021 в 02:45)
Например в чате обновилась страничка как сохранить  положение скрола ?

Энмеркар (9 Nov 2021 в 04:26)
-MiSHuTkA-, Если ты имеешь виду полосы прокрутки,, то проще некуда вот код 
<sсript type=\"text/javasсript\">
$(window).scroll(function() {
  sessionStorage.scrollTop = $(this).scrollTop();
});
$(document).ready(function() {
  if (sessionStorage.scrollTop != \"undefined\") {
    $(window).scrollTop(sessionStorage.scrollTop);
  }
});
</sсript>
Страничка сайта фиксируется на том месте где человек обновил или же отправил сообщение

Энмеркар (9 Nov 2021 в 04:47)
Но на DCMS это хрень будет страницы при обновление не статичные на них идёт изменения типа ловилок всяких и т.д...

-MiSHuTkA- (9 Nov 2021 в 05:31)
Энмеркар, спасибо щас попробую этот код

-MiSHuTkA- (9 Nov 2021 в 05:32)
Энмеркар, да именно положение скрола нада
а насчет ловилок подробней можно описать что это ??

-MiSHuTkA- (9 Nov 2021 в 09:06)
Энмеркар, да твой скрипт работает-при обновлении сохраняет позицию скролинга
мне нада не чтоб при нажатии отправить сообщение сохранялась позиция скрола
а этот скрипт твой неподошел или я его неправильно поставил как сделать чтоб при нажатии на Отправить а это уже форма сохранялась позиция скрола вот что нада щас тестирую разное но пока не нашел подходящего - есть идея по якорю сделать чтоб после отправки перебрасовало в конец формы после самой формы но это тест покамись - вобщем будет так написал сообщение и увидел его после отправки -или скролом или якорем нада реализовать

-MiSHuTkA- (9 Nov 2021 в 09:42)
Энмеркар, спасибо за код 
задачу решил
вобщем твой код нада вставить после формы  а в форме отправки перед Отправкой вписать этот код
?><input type=\"hidden\" name=\"scroll\" value=\"\"><?
Вот что получилось
<?
////// 
echo \"<form method=\"post\" name=\'message\' action=\"room.php?$passgen&\".$go_otv.\"\">\";
echo \'<textarea id=\"message\"name=\"msg\">\'.$respons_msg.\'</textarea><br />\';
}
echo \'<br />\';
echo \'<input value=\"Отправить\" type=\"submit\" /> <a style = \"padding: 5px; border: 1px solid silver;\" href=\"?retr\">ќбновить</a><br /><br />\';
?><input type=\"hidden\" name=\"scroll\"><?
echo \"</form>\";
?>
<sсript>
$(window).scroll(function() {
sessionStorage.scrollTop = $(this).scrollTop();
});
$(document).ready(function() {
if (sessionStorage.scrollTop != \"undefined\") {
$(window).scrollTop(sessionStorage.scrollTop);
}});
</sсript><?
///////
?>

-MiSHuTkA- (9 Nov 2021 в 10:20)
--Цитата--
Энмеркар (9 Nov 2021 в 04:26):
-MiSHuTkA-, Если ты имеешь виду полосы прокрутки,, то проще некуда вот код 
<sсript type=\"text/javasсript\">
$(window).scroll(function() {
  sessionStorage.scrollTop = $(this).scrollTop();
});
$(document).ready(function() {
  if (sessionStorage.scrollTop != \"undefined\") {
    $(window).scrollTop(sessionStorage.scrollTop);
  }
});
</sсript>
Страничка сайта фиксируется на том месте где человек обновил или же отправил сообщение
----------
Энмеркар, но есть одно но 
при переходе на  на страницу с где этот код  выдает прежнее положение страницы

DoR (9 Nov 2021 в 19:40)
-MiSHuTkA-, Привет, смотри...
 --- При условии если scrollTop не пустая, то выбираешь значение и локальной сессии.
Что получается... При обновлении странички сначала запись обновляется ( то есть, если старая запись есть, то она заменяется новой ) и только после это срабатывает вывод.
Потому что $(document).ready(function() ждёт пока загрузиться ДОМ, то есть $(window).scroll(function() срабатывает быстрее.
 --- Попробуй так:
<sсript type=\"text/javasсript\">
$(document).ready(function() {
if (sessionStorage.scrollTop != \"undefined\") {
// --- Сначала проверяем на заполненность локальной сессии и если она не пустая выводим.
$(window).scrollTop(sessionStorage.scrollTop);
}
$(window).scroll(function() {
// --- А уже потом перехватываем событие жеста и пишем в локальную сессию.
sessionStorage.scrollTop = $(this).scrollTop();
});
});
</sсript>
Извини если очень плохо пояснил...
Какой день, так и поясняю...))

-MiSHuTkA- (10 Nov 2021 в 03:23)
DoR, да работает твой скрипт!
Спасибо !  
вставил просто так послле </textarea><br />\';и все !
echo \'<textarea id=\"message\"name=\"msg\">\'.$respons_msg.\'</textarea><br />\';
}
echo \'<br />\';
//////////// СКРОЛИНГ
?>
<sсript>
$(document).ready(function() {
if (sessionStorage.scrollTop != \"undefined\") {
// --- Сначала проверяем на заполненность локальной сессии и если она не пустая выводим.
$(window).scrollTop(sessionStorage.scrollTop);
}
$(window).scroll(function() {
// --- А уже потом перехватываем событие жеста и пишем в локальную сессию.
sessionStorage.scrollTop = $(this).scrollTop();
});
});
</sсript><?
?><?
//////////////////
Удобно стало! Не нада после написания сообщения листать вниз страничку чтоб увидеть написаное я думаю это многим пригодится - как идея? Такого нет всетаки в соц сетях -может разработчики DCMS это внедрят себе в модуль глобально -а почему и нет? Пишеш к примеру сообщение и после отправки возвращаешся в ту позмцию полосы прокрутки-скрола !

-MiSHuTkA- (10 Nov 2021 в 07:04)
DoR, 
После формы отправки вставил и после отправки позицию скрола-полоса прокрутки возвращается в то положение где была отправка -удобно -не нада листать страничку чтоб увидеть написаное и время экономится -если посчитать сэкономленое время на прокрутку сколько тратися то выйдет много а этот скрипт избавит от лишний траты времени ! 
Решено вот! 
echo \"</form>n\";// это где оканчивается форма
та позиции ее не вписуйте
после формы это ставите
////////// СКРОЛИНГ
?>
<sсript>
$(window).scroll(function() {
sessionStorage.scrollTop = $(this).scrollTop();
});
$(document).ready(function() {
if (sessionStorage.scrollTop != \"undefined\") {
$(window).scrollTop(sessionStorage.scrollTop);
}});
</sсript><?
?><?
У меня идея еще была но незнаю как правильней -по якорю можно сделать еще 
там проще -может подскажеш как в отправке форме вернуть на положение кнопки отправить 
такой смысл -тоже реально но тестировал по свойму разное и недоделал -по разному можно а как лучше тож не знаю -все сырое

DoR (10 Nov 2021 в 14:06)
-MiSHuTkA-, Привет. Молодец:)
А спасибо говори Энмеркар, он то тебе изначальный код дал.
 --- Вот простенький пример.
<sсript>
$(document).ready(function(){
    $(\"#menu\").on(\"click\",\"a\", function (event) {
// --- отменяем переход по ссылке
        event.preventDefault();
// --- получаем идентификатор бока с атрибута href
        var id  = $(this).attr(\'href\'),
// --- узнаем высоту от начала страницы до блока на который ссылается якорь
            top = $(id).offset().top;
// --- анимируем переход на расстояние - top за 1500 мс
        $(\'body,html\').animate({scrollTop: top}, 1500);
    });
});
</sсript>
Если не будет получается, скачай архив.
В нём рабочий пример...)

Источник: http://dcms-social.ru/forum/13/34/63337/