jquery запоминает состояние анимации после перезагрузки страницы

Question

У меня есть блок, следующий за кнопками меню, чтобы указать, какая из них активна. Есть ли способ сохранить местоположение блока после обновления? На данный момент местоположение сбрасывается, когда я нажимаю ссылку на подстранице.

код запроса:

$( "button",document.body ).click(function(){
    var offset = $(this).offset();
    var offsetBody = $("body").offset();
  $( "#block" )
     .animate({
    left: (offset.left - offsetBody.left) 
  }, 200);
});

Answer 1

Jquery - это клиентский скрипт. Когда вы перезагружаете страницу или переходите на новую страницу, вы запрашиваете информацию с сервера, а это означает, что все данные на стороне клиента теряются.

Однако, в зависимости от конкретной проблемы, может быть несколько решений.

1. Если вас интересует только местоположение блока на каждой странице в отдельности, вы можете закодировать некоторый элемент в разметке, чтобы значение атрибута было равно чему-то, проверьте это значение при загрузке, если DOM и переместить блок соответственно.

2. Вы можете использовать файлы cookie на стороне клиента для хранения значения, и при загрузке DOM проверьте эту переменную и соответственно анимируйте блок.

3. Вы можете использовать вызов AJAX для установки серверной переменной в PHP и использовать эту переменную для динамического создания элемента в 1.

Как вы думаете, будет ли работать любое из этих трех решений? Я могу рассказать подробнее, если вы можете сказать мне более точно, как бы вы хотели этого достичь.

Для метода 1.

Используйте метод JQuery .attr () , чтобы;

Разметка

<meta name="description" content="home" />

JQuery

var page = $('meta[name=description]').attr("content");
if (page == "home") {
    // you know where it should be
} else if (page == "account") {
    // you know where it should be
}

Однако меня немного беспокоит, что это не та функциональность, которая вам нужна, не так ли?

Для метода 3

Разметка

<?php
    session_start();
    $pos = $_SESSION['position'];
    echo '<meta name="description" content="' . $pos . '" />'
?>

JQuery

var position;
// perform animation stuff and store position in the variable
// make a post() request after the position has changed
$.post("position.php", { pos: position } );

PHP position.php

<?php
    session_start();
    $_SESSION['position'] = $_POST['pos'];
?>

Answer 2

Вы можете сохранить позицию в следующем объекте.1. Локальное хранилище (поддержка браузера) В современных браузерах вы можете сохранить положение в Localstorage.Плюсы: быстро, удобно.минусы: вам нужно обращаться с кросс-браузером.2. Серверная сторона.В противном случае вам нужно хранить его в серверах () профи: не нужно принимать во внимание браузеры.минусы: медленно, вам нужно беспокоиться о задержке интернета.3. Печенье.