Казакевич Алексей | Домашний сайт кодера | Заметки кодера

Самым простым способом организовать переход наверх страницы является размещение пустой ссылки <a name="top"></a> после тега <body>, а внизу страницы ссылки <a href="#top">наверх</a>.
Такой способ описан в любом справочнике по HTML.

Меня всегда раздражал один минус такого метода, о котором не задумываются кодеры.
Переход по такой ссылке записывается в историю, и, чтоб вернуться на предыдущую страницу, необходимо нажать «Назад» дважды (что иногда раздражает). При этом в конце адреса страницы прибивается #top, что тоже не очень красиво.

В браузере Internet Explorer 5.0 при переходе по такому якорю исчезает название страницы в заголовке браузера и появляется ее имя.

Я использую такой прием:
<a href="#" onclick="scroll(0,0); return false;">наверх страницы</a>

В чем фишка?
Есть такой метод как window.scroll(x,y). С его помощью можно промотать страницу на (x) пикселов по горизонтали и на (y) по вертикали. Если обнулить эти два параметра, то страница проскролится в начало. Для того, чтобы при переходе по ссылке (а как же ссылка без атрибута href) в адрес страницы ничего не добавлялось, возвращаем false.

Для тех, кто любит говорить: «А если пользователь отключит JavaScript?… А если отключит каскадные листы стилей?…»
Отвечаю: «А если он монитор отключит? Мне у него дома на обоях сайт нарисовать?» :-)
Во всяком случае никто не мешает подстраховаться. Вместо href="#" написать href="#top", предварительно разместив якорь <a name="top"></a>. Если так случится, что скрипты у пользователя будут выключены, — сработает старый надежный способ.

Бросаем якорь «наверх страницы»

Рабочий код