Возможно ли изменение URL-адреса при прокрутке вниз по одной странице
Можно ли изменить URL-адрес, пока вы прокручиваете одну страницу с помощью ajax? У меня есть сайт на одной странице и вы хотите иметь этот эффект.
Пример:
www.blablabla.com/blog
пользователь прокрутит вниз...
www.blablabla.com/blog/entry-name
Я знаю о хешировании... могу ли я замаскировать URL?
Ответы
Ответ 1
Я знаю, что это немного более старый вопрос, но браузеры изменились, и прямо сейчас можно сделать то, что запросил плакат. Это означает, что большинство других ответов более недействительны. Я отправляю способ выполнить это, чтобы он мог помочь людям, использующим Google, найти правильный ответ.
Короче говоря, в современных браузерах (браузеры с поддержкой HTML 5) вы можете. Пожалуйста, посмотрите эту статью.
В основном это сводится к следующей строке кода:
window.history.pushState("object or string", "Title", "/new-url");
Выполнение вышеуказанного кода изменит URL-адрес на example.com/new-url и поможет вам выполнить то, что вы хотели.
Для демонстрации вы можете взглянуть на Webby Awards, где используется этот метод. Просто прокрутите вверх или вниз и посмотрите на адрес. Эффект впечатляет.
Ответ 2
Вы можете использовать pushState(), чтобы изменить URL-адрес, отображаемый в строке URL-адреса браузера без перезагрузки или использования хэша. Пока ваш браузер поддерживает HTML5.
https://developer.mozilla.org/en/DOM/Manipulating_the_browser_history
Ответ 3
Нет. Не уверен, почему вы тоже захотите.
Как вы упомянули, единственным способом было бы добавить его на хэш страницы, например.
http://www.website.com/blog/#entry-name
Затем, чтобы перейти к той части страницы, что-то вроде:
if (window.location.indexOf("#") > 0) {
var entry_id = window.location.substring(window.location.indexOf("#"));
$('html, body').animate({
scrollTop: $(entry_id).offset().top
}, 2000);
}
EDIT: это возможно с помощью window.history.pushState
.
Ответ 4
как насчет https://github.com/browserstate/history.js/ history.js
Включая постоянную поддержку данных, названий, replaceState. Поддерживает jQuery, MooTools и Prototype. Для браузеров HTML5 это означает, что вы можете изменить URL-адрес напрямую, без необходимости использовать хеши.
Ответ 5
Да, вы можете, но это немного сложно.
Если у вас есть это на странице index.html
:
<a id="link-to-later" href="#later">Go to later</a>
<p>lorem ipsum</p><p>lorem ipsum</p><p>lorem ipsum</p><p>lorem ipsum</p><p>lorem ipsum</p><p>lorem ipsum</p><p>lorem ipsum</p><p>lorem ipsum</p><p>lorem ipsum</p><p>lorem ipsum</p><p>lorem ipsum</p><p>lorem ipsum</p><p>lorem ipsum</p><p>lorem ipsum</p><p>lorem ipsum</p><p>lorem ipsum</p><p>lorem ipsum</p><p>lorem ipsum</p><p>lorem ipsum</p><p>lorem ipsum</p><p>lorem ipsum</p><p>lorem ipsum</p><p>lorem ipsum</p><p>lorem ipsum</p><p>lorem ipsum</p>
<a id="later" name="later">Some later anchor</a>
Затем щелчок по верхней ссылке приведет вас к якорю ниже, не перезагружая страницу, и URL будет index.html#later
.
Используя событие window.onscroll
, вы можете подключить событие к пользователю, прокручивающему страницу. Обработчик событий может включать в себя что-то вроде $('#link-to-later').click()
, которое отправляет браузеру пользователя на страницу с помощью привязки later
.
Вам нужно будет сделать некоторую работу, чтобы это не было слишком прерывистым, но это выполнимо.
Ответ 6
Нет, по соображениям безопасности вам не разрешено изменять URL-адрес с помощью javascript