Навигация по страницам (внутри страницы) на основе тегов привязки без истории браузера (или к URL добавляется #anchor) - PullRequest
1 голос
/ 24 января 2012

У меня длинная страница, и я использую меню для навигации по разным ее частям с помощью тега привязки.
Это, однако, записано в истории браузера. Таким образом, возвращение «назад» приведет вас только к странице, а не к предыдущей «реальной» странице.

Как я могу использовать это, а не записывать в историю браузера - возможно, используя jQuery или аналогичный, или, может быть, даже без обновления URL-адреса самим тегом #anchor?

Я кодирую в HTML5.


Вот код меню:

<div class="entry_jump_menu clearfix">
 <ul class="basic_menu">
  <li><a href="entry_about" class="entry_page_anchor_menu menu_about">About</a></li>
  ....
 </ul> 
</div>

и якорь:

 <div id="entry_about ...>
  ... some content ...
 </div>

Я не смог заставить работать приведенный ниже код, поэтому я использовал его вместо этого.

/**
 * ANCHOR TAGS WITHOUT HISTORY
 */   
$('.entry_page_anchor_menu').click(function(){
    var jump = $(this).attr('href');
    var new_position = $('#'+jump).offset();
    window.scrollTo(new_position.left,new_position.top);
    return false;
});

Большое спасибо Давиду за его усилия. Жаль, что я не смог заставить его работать вообще.

1 Ответ

3 голосов
/ 24 января 2012

Хммм, ваш jQuery мне кажется работоспособным.С некоторыми небольшими модификациями я создал это:

$(function(){
    $('.entry_page_anchor_menu').click(function(e){
        e.preventDefault();
        var jump = $(this).attr('href').substring(1);
        var new_position = $('#'+jump).offset();
        window.scrollTo(new_position.left,new_position.top);
    });
});

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

...