HTML+CSS+JavaScript

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

Т.е. я нажимаю на <a href = "site.ru/page.html#05&#8243; >Пятый</a> и попадаю на страницу page.htm на якорь в теге <a name= "05&#8243; >Пятый</a>, только чтобы этот тег был по середине страницы и был как-нибудь выделен.

Спасибо.

site.ru/page.html#05&#8243; - это собственно говоря чушь. Символ "решетка" указывает на якорь, при чем их имена не могут начинаться с цифры, а тем более бессвязный их набор. Якорь это метка на странице, а не набор GET параметров, никаких перечислений hash значений в url через & быть не может.

>этот якорь находился не на верху (как это сделано по умолчанию у всех браузеров)

Нет такого в браузерах, просто не найдет браузер "каши", которую вы ему подсовываете и поэтому останется в начале документа.


http://softtime.ru/forum/read.php?id_forum=4&id_theme=89854

я не это имел в виду, произошла замена символа: site.ru/page.html#05&#8243

должно было быть так: <a href = "site.ru/page.html#05">
а если с цифр нельзя то так: <a href = "site.ru/page.html#five" >

За ссылку спасибо. С выделением вроде все понятно, а как на середину переместить?

На какую середину?
Hash - это либо тег А //пример <a name="as1">
либо атрибут id любого тега на странице //например <div id="as1">
в положение которого и будет произведен переход (если потребуется, то и прокрутка документа) на странице. Естественно, если указанный якорь находится в середине документа, то в это место и произойдет переход.

Имеется в виду, чтобы после перехода теги <a name="as1"> или <div id="as1"> оказались у пользователя не вверху окна, а с отступом сверху (если, конечно, над ним есть какой-то контент). Т.е. с прокруткой его чуть ниже, до середины окна.

Понятно что имелось под "по умолчанию вверху". Браузер прокручивает (если требуется) содержимое якоря по верхнему краю клиентской области окна именно потому, чтобы обеспечить видимость всего или максимально возможное его содержимого. То есть, если прокручивать якорь на середину и при этом часть его содержимого будет скрыта, то полезность такой прокрутки сомнительна.

Но если это так необходимо, то учитывая, что браузер прокручивает якорь, остается после этого прокрутить документ (scrollTop) на текущее значение scrollTop минус высоту клиентской области окна деленной на два, то есть clientHeight/2. Естественно, что прокрутка именно на середину произойдет только в том случае, если это будет соответствовать условию.

А как это на практике должно выглядеть.
Для меня clientHeight/2 мало что значит. Я так понимаю, что это JSкод. Прошу, подскажите как это реализовать человеку, не знающему JS.
Спасибо.

Оказывается не так все и просто, получить по переходу по якорю положение документа. Надо подумать.

Буду очень признателен. Делается это для прайса с листингом позиций каталога, где каждая позиция имеет свой якорь в теге <a> и при переходе на нее с других страниц сайта пользователи не видят то, что на самом верху, начинают все листать и путаются. Поэтому нужно это выделение в середине страницы.

В общем только через таймер, так как задействовать событие onscroll означает проблемы (не знаю что вам надо обрабатывать, но вот для примера в функции по ссылке - переход по якорю содержащемуся в url):

function setHash() {       target = location.hash.replace('#','');       if(e = document.getElementById(target)) e.className = 'mark';      else target = null;     setTimeout(function() {         var h   =  (window.innerHeight ? window.innerHeight : (document.documentElement.clientHeight ? document.documentElement.clientHeight : document.body.offsetHeight))/2,             top = window.pageYOffset != undefined ? window.pageYOffset :             function() {                var doc =  document.documentElement || document.body,                    off =  doc.scrollTop || doc && doc.scrollTop || 0;                return off -= doc.clientTop;             };         window.scrollTo(0, top-h);     }, 200); }

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

Метод scrollTo объекта window вместо ранее упоминаемого выбран исходя из кроссбраузерности (должен везде работать).

>при переходе на нее с других страниц сайта пользователи не видят то, что на самом верху...

То есть url все таки содержит hash? Если отмечать якорь, то почему не увидит? Собственно говоря это не обязательно и якорь может быть, если пользователь выбирает нечто на странице имеющее идентификатор, то уже на стороне сервера можно будет знать в какое место должен быть прокручен документ при получении его клиентом. А если недостаточно выделения, то можно сделать прокрутку с анимацией, при этом конечная позиция анимации не обязательно "на середину". Анимация сама по себе уже "подсказка", например, посмотрите в сети как делают плавную прокрутку документа к якорю, при этом якорь все такие вверху документа, это считайте "де юре" по умолчанию, к чему привыкли, изменять поведение привычного, это не всегда оправданно. При этом в качестве якоря лучше использовать атрибут id элемента, а не тег A (выше приведенный код именно на этом и строится).

Спасибо огромное, все отлично работает.

Вот, "накверил": http://jsbin.com/ezohic/1/edit