Поддержка Проблемы и решения Кнопка «В начало страницы»

  • Здравствуйте.
    Использую тему InSense.
    Подскажите, как добавить кнопку «В начало страницы» внизу главной страницы, чтоб после нажатия на неё, перемещаться в самый верх?

Просмотр 12 ответов — с 1 по 12 (всего 12)
  • Atrax

    (@atrax)

    Ethical engineer

    Поставьте в начале страницы
    <a name="top" />
    а в конце
    <a href="#top">В начало страницы</a>

    Спасибо.
    Но есть ещё проблемка. Подскажите, куда прописать якорь , чтобы переход осуществлялся в самый верх страницы (а то куда бы не вставлял — всё-равно в самый верх не перемещается — хотя-бы немного, но от верха страницы отступ остаётся). И ещё — смущает, что при переходе по ссылке «В начало странице» в адресной строке добавляется #top к адресу (что-то типа http:// http://www.бла-бла.ru/#top) — это никак нельзя обойти?
    И ещё — как и в каком месте вставить <a href="#top">В начало страницы</a>, чтобы надпись «В начало страницы» располагалась справа внизу поста (см. скрин )

    Модератор Sergey Biryukov

    (@sergeybiryukov)

    Live and Learn

    1. Якорь можно заменить на JavaScript:

    <a href="javascript:window.scrollTo(0,0);">В начало страницы</a>

    2. Где-то рядом с блоком комментариев 🙂 По скриншоту непонятно, какая тема используется.

    В первом сообщении я указал тему (InSense) 🙂

    Модератор Sergey Biryukov

    (@sergeybiryukov)

    Live and Learn

    Ага 🙂 Тогда сразу после <ul class="PostCom">...</ul> и с выравниванием по правому краю:

    <a style="float: right" href="javascript:window.scrollTo(0,0);">В начало страницы</a>

    Спасибо, реализация с помощью JavaScript — то что надо! 🙂
    Только при размещении его после <ul class="PostCom">...</ul>, ссылка «В начало страницы» располагается под горизонтальной серой линией, а как бы сделать, чтоб над линией — строго напротив надписи «0 комментариев»? (см. скрин)

    Модератор Sergey Biryukov

    (@sergeybiryukov)

    Live and Learn

    Откуда серая линия? В исходной теме рядом с количеством комментариев её нет. Можно попробовать поставить перед <ul class="PostCom">...</ul>.

    Тема модифицировалась — в style.css строчка .PostCom { padding: 0px; margin: 0px; font-size: 11px; display: inline;} менялась на .PostCom { height: 25px; padding: 0px; margin: 0px; font-size: 11px; clear: both; border-bottom: 1px solid #e2e2e2; }
    Если поставить скрипт перед <ul class="PostCom">...</ul>, то ссылка «В начало страницы» располагается чуть выше, чем надо (см. скрин)
    Можно ли сделать, чтоб напротив надписи «0 комментариев»?

    Модератор Sergey Biryukov

    (@sergeybiryukov)

    Live and Learn

    <ul class="PostCom">
     <li><?php comments_popup_link('<strong>0</strong> Comments', '<strong>1</strong> Comment', '<strong>%</strong> Comments'); ?></li>
     <li><a style="float: right; background: none;" href="javascript:window.scrollTo(0,0);">В начало страницы</a></li>
    </ul>

    При таком раскладе в FireFox отображается так как и хотелось, а вот в IE 7 — нет. 🙁 (см. скрин)

    Модератор Sergey Biryukov

    (@sergeybiryukov)

    Live and Learn

    Можно добавить display: inline для .PostCom li в style.css:

    .PostCom li { padding: 0px; margin: 0px; list-style-type: none; display: inline; }

    Спасибо большое!
    Теперь всё как надо! 🙂

Просмотр 12 ответов — с 1 по 12 (всего 12)
  • Тема «Кнопка «В начало страницы»» закрыта для новых ответов.