блок прилепленный к верху окна

Тема в разделе "Веб-дизайн", создана пользователем Orbit, 9 дек 2010.

Статус темы:
Закрыта.
Модераторы: zek24
  1. Orbit

    Orbit Постоялец

    Регистр.:
    3 апр 2007
    Сообщения:
    145
    Симпатии:
    74
    возникла необходимость сделать на сайте блок навигации (полоску) которая бы при прокрутке всегда оставалась в левом верхнем углу окна, но нюанс в том, что при верхнем положении она должна оставаться под шапкой сайта, а как только прокручиваем страницу до нее, то она как бы зацепляется за верхний край окна и дальше уже прилеплена к нему.
    Подскажите, пожалуйста, возможно такое вообще сделать и если да то как? может кто видел сайты с подобной штукой?
     
  2. reds

    reds Создатель

    Регистр.:
    5 янв 2008
    Сообщения:
    41
    Симпатии:
    20
    вам наверное нужно что то типа такого http://demo.rockettheme.com/?template=paradox
    попробуйте оттуда код выдрать.
     
  3. Orbit

    Orbit Постоялец

    Регистр.:
    3 апр 2007
    Сообщения:
    145
    Симпатии:
    74
    спасибо, но это не то. Там сделан фрейм, тут фрейм не подойдет.

    Как я писал, хотелось бы сделать, чтобы пока блок в пределах видимости он бы стоял на своем месте (не в самом верху), а как только при скроллинге верхний край окна доходил до него, блок бы "цеплялся" и был бы уже прилеплен к нему (к верху окна).
     
  4. Phrack

    Phrack

    Регистр.:
    3 ноя 2010
    Сообщения:
    264
    Симпатии:
    38
    PHP:
    <div style="position:static">
     <
    div style="position:fixed">движущийся див</div>
    </
    div>
    как прятать при движении вверх страницы - не знаю, попробуйте через z-index
     
  5. Orbit

    Orbit Постоялец

    Регистр.:
    3 апр 2007
    Сообщения:
    145
    Симпатии:
    74
    подсказали мне пример на гугле:
    http://www.google.ru/search?sclient=psy&hl=ru&newwindow=1&q=игрушки+москва
    карта справа так себя ведет
    похоже надо мерить растояние до верху, как оно больше нужного менять на fixed
     
  6. Phrack

    Phrack

    Регистр.:
    3 ноя 2010
    Сообщения:
    264
    Симпатии:
    38
    костыли, костыли,считать вычислять...

    http://jsfiddle.net/R22c3/
     
Статус темы:
Закрыта.