<a> идентификаторы якорей / фрагментов не работают - PullRequest
Новая
       0

<a> идентификаторы якорей / фрагментов не работают

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

У меня есть такая разметка на somepage.html: 

<div class='someclass' id='hashtag1'>
  <h1>somecontent</h1>
</div>
<div class='someclass' id='hashtag2'>
  <h1>somecontent</h1>
</div>
<div class='someclass' id='hashtag3'>
  <h1>somecontent</h1>
</div>

И такие ссылки на другой странице (назовем это someotherpage.html): 

<a href='somepage.html#hashtag1'>first content div</a>
<a href='somepage.html#hashtag2'>second content div</a>
<a href='somepage.html#hashtag3'>third content div</a>

Однако, когда я нажимаю на одну из этих ссылок, я не вижу ожидаемого поведения - страница загружается как обычно, но scrollTop окна не соответствует этим элементам div. Я попытался изменить идентификаторы, так как для начала у них были дефисы, это не имело никакого значения - я также попытался изменить элемент, на котором находится идентификатор, то есть изменил <h1>, чтобы иметь идентификатор, затем изменил <h1> на якорь, но не повезло.

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

Я что-то упускаю здесь очевидное?

EDIT:

  • Использование FF 9.0.1 на Mac OSX
  • Отключил JS с помощью панели инструментов веб-разработчика
  • изменение или удаление CSS, кажется, не имеет никакого значения

UPDATE: Это прекрасно работает, если я включаю JavaScript - именно тогда, когда он не должен работать. У меня есть это как улов для пользователей без javascript / отключен JS. WTF, firefox?

Ответы [ 2 ]

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

Учитывая ваш конкретный пример, мне кажется, что scrollTop изменяется только тогда, когда страница уже достаточно длинна, чтобы требовать прокрутки.

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

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

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

Хештеги не работают с id с.Вы должны поставить теги a, например: <a name="foo"></a>.Затем вы можете связаться с ними, используя <a href="#foo">go to foo</a>.То же самое касается ссылок между несколькими страницами.

...