Как сделать блок, который не перезагружается?

Question

[Ayk72]

Как сделать блок с плеером, чтобы при переходах на другие страницы он не перезагружался?
Как плеер вк

Comments

[Ayk72]

Так же работает www.mp3poisk.net

Answer 1

[Евгений Петров]

С перезагрузкой страниц ответ — никак.

Для безостановочной работы плеера вы самостоятельно переформируете контент страниц, используя AJAX и добавляя в History новые записи.

Это потянет за собой механизм отслеживания адресной строки на клиенте с выбором сценариев, выдачу сервером кода целой страницы или только контента (возможно, не всего, а только частей в зависимости от переданных параметров).

Если вы в состоянии грамотно реализовать это — велкам. Если не понимаете, о чём идёт речь, то возвращаемся к первой фразе.

Comments

[Ayk72]

Ок, понял. А скажите, получается, что при ответе сервера не должно быть тегов HTML в подгружаемой странице, тегов т.е. , только содержимое?

[Евгений Петров]

@Ayk72 это не имеет значения. Почему не должно быть?
Полученный ответ — текст. Что на деле он представляет — вам решать. XML, JSON, просто текст, или с текст с тэгами — это определяет фронтенд разработчик.

Если получаете HTML, то будете просто его вставлять куда нужно, заменяя предыдущее содержание. Или добавляя... Тут вам решать, что происходить должно:)

[Ayk72]

Да, но есои все будет обновляться в одном блоке, то тайтл + меню, которые постоянно отправляют CMS они ведь полную страницу отправляют, как отправлять только контент? А не верхнее меню и тд...

[Евгений Петров]

@Ayk72 параметр в запросе, по которому серверный скрипт понимает — отдать только данные или вместе с обвязкой.

[Евгений Петров]

@Ayk72 при написании такого решения у вас появится много параметров, которые будут описывать состояние интерфейса. Часть только для отправки серверу в AJAX-запросе, часть будет использоваться в адресной строке.

Разбирать адресную строку должны уметь и клиент, и сервер. Посмотрите вот это Как написать одностраничное веб-приложение на javascript?

[Ayk72]

www.mp3poisk.net на чем работает, не подскажите? У него и тайтлы меняются. а плеер играет везде..

[Евгений Петров]

@Ayk72 Именно так и работает.
Откройте www.mp3poisk.net и анализатор. Добавьте в блок плеера текст, или атрибут. Если бы страницы перегружались, то блок перестраивался бы, но ваши правки будут стоять как вкопанные.

Именно так и предлагается делать вам — запрос по клику с сайта и запрос из адресной строки выдают разное. А как сделать, чтобы роботы получали полный текст при переходе, а пользователь только обновлял контент некоторых блоков? Просто. Обращаем внимание на заголовок
X-Requested-With="XMLHttpRequest"
Вот в нём и порылась собака. Однако, и кроме этого есть ряд моментов, например, работа с History, переопределение document.title и прочее, и прочее.

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

Answer 2

[Александр Таратин]

Пeревести сайт на ajax + history api

Ну или на крайняк обернуть весь сайт в iframe, а блок оставить в основном окне.

Comments

[Евгений Петров]

iframe — тоже вариант, но точно также потребует манипуляций с History.

[Ayk72]

Ок, понял. А скажите, получается, что при ответе сервера не должно быть тегов HTML в подгружаемой странице, тегов т.е. , только содержимое?

[Александр Таратин]

@Ayk72 через ajax можно передавать любые данные.

[Ayk72]

Да, но есои все будет обновляться в одном блоке, то тайтл + меню, которые постоянно отправляют CMS они ведь полную страницу отправляют, как отправлять только контент? А не верхнее меню и тд...

[Ayk72]

www.mp3poisk.net на чем работает, не подскажите? У него и тайтлы меняются. а плеер играет везде.

[Александр Таратин]

@Ayk72 вероятно у них свой велосипед.

Answer 3

[Эдуард Кожевников]

iframe не пробовали?