VPF::как грамотно "подвесить" div - Форум программистов

Astraller

Дата 2.8.2007, 15:57 (ссылка)

(нет голосов)

Загрузка ...

Опытный

Профиль
Группа: Участник
Сообщений: 300
Регистрация: 1.8.2007
Где: $Украина[Кры м]->Феодосия

Репутация: 2
Всего: 5

Хочу сделать висящий див (который всегда на странице - даже при прокрутке) но при этой самой прокрутке он дергается... т.е. идёт не плавно... но на этой странице:
http://www.quirksmode.org/resources.html
Все работает отлично. Объясните почему, плиз! smile

--------------------

A.S.T.R.A.L.L.E.R.: Artificial Synthetic Technician Responsible for Assassination, Logical Learning and Efficient Repair

GZep

Дата 2.8.2007, 16:06 (ссылка)

(нет голосов)

Загрузка ...

участник Винграда

Профиль
Группа: Завсегдатай
Сообщений: 1528
Регистрация: 7.7.2006
Где: Москва

Репутация: 2
Всего: 32

это не javascript а css!
Astraller, разве сложно почитать документацию? смотрите position

--------------------

Astraller

Дата 2.8.2007, 16:14 (ссылка)

(нет голосов)

Загрузка ...

Опытный

Профиль
Группа: Участник
Сообщений: 300
Регистрация: 1.8.2007
Где: $Украина[Кры м]->Феодосия

Репутация: 2
Всего: 5

Цитата(GZep @ 2.8.2007, 16:06)

это не javascript а css!
Astraller, разве сложно почитать документацию? смотрите position

position смотрел но не увидел там ничего такого что может мне помочь.
Подскажите что просмотрел.

--------------------

A.S.T.R.A.L.L.E.R.: Artificial Synthetic Technician Responsible for Assassination, Logical Learning and Efficient Repair

AKS

Дата 2.8.2007, 16:51 (ссылка)

(голосов:1)

Загрузка ...

Участник форума

Профиль
Группа: Участник
Сообщений: 725
Регистрация: 20.9.2006

Репутация: 27
Всего: 52

Цитата(Astraller @ 2.8.2007, 16:14

)

Подскажите что просмотрел.

Наверно position:fixed...

dXdYdZ

Дата 3.8.2007, 14:11 (ссылка)

(нет голосов)

Загрузка ...

Шустрый

Профиль
Группа: Участник
Сообщений: 146
Регистрация: 16.4.2007

Репутация: 3
Всего: 4

Цитата

Наверно position:fixed...

По-моему это оно и есть. Но фиксированное позиционирование работает не во всех браузерах (например оно не работает в IE 6). Поэтому при необходимости универсального решения фиксированное позиционирование применяют вместе с JavaScript (в IE 6 - двигают JavaScript-ом). Но в случае с JavaScript оно и будет подёргиваться.

AKS

Дата 3.8.2007, 15:22 (ссылка)

(нет голосов)

Загрузка ...

Участник форума

Профиль
Группа: Участник
Сообщений: 725
Регистрация: 20.9.2006

Репутация: 27
Всего: 52

Цитата(dXdYdZ @ 3.8.2007, 14:11

)

Но в случае с JavaScript оно и будет подёргиваться.

Если в этом самом JavaScript'е написать так:

Код


document.body.setAttribute('background', ' ');
document.body.setAttribute('bgproperties', 'fixed', 0);

, то дергаться не будет...

dXdYdZ

Дата 10.8.2007, 00:49 (ссылка)

(нет голосов)

Загрузка ...

Шустрый

Профиль
Группа: Участник
Сообщений: 146
Регистрация: 16.4.2007

Репутация: 3
Всего: 4

А в IE это будет работать? Ведь речь идёт про IE, который не поддерживает фиксированное позиционирование.

Alx

Дата 10.8.2007, 04:26 (ссылка)

(нет голосов)

Загрузка ...

Ajaxy

Профиль
Группа: Комодератор
Сообщений: 2903
Регистрация: 26.11.2003
Где: Cutopia

Репутация: 10
Всего: 78

dXdYdZ,
надо по onscroll задвать координаты слоя согласно координатам прокрутки (во всех браузерах), а чтобы в IE не было рывков, нужно задать body - background - position - fixed. это такая магическая загадка которую, говорят, придумал сам БГ! ;)

--------------------

Alex_B

Дата 10.8.2007, 10:32 (ссылка)

(голосов:1)

Загрузка ...

Шустрый

Профиль
Группа: Участник
Сообщений: 122
Регистрация: 24.4.2007

Репутация: нет
Всего: 1

Вот так можно зафиксировать DIV:

Код


div#fix{
    width:100%;
    top:0px;
    left:0px;
    position:fixed;
    //position: absolute;
    top: expression(
        parseInt( document.documentElement.scrollTop, 10) + 300 + "px"
    );
}

Что бы при прокрутке в IE этот блок не дрожал нужно для body указать:

Код


body{
    margin:0;
    padding:0;
    background-image: url(../images/n.jpg);
    background-attachment: fixed;
}

dXdYdZ

Дата 10.8.2007, 13:30 (ссылка)

(нет голосов)

Загрузка ...

Шустрый

Профиль
Группа: Участник
Сообщений: 146
Регистрация: 16.4.2007

Репутация: 3
Всего: 4

Ясно. Спасибо за информацию.

Alx

Дата 10.8.2007, 15:02 (ссылка)

(нет голосов)

Загрузка ...

Ajaxy

Профиль
Группа: Комодератор
Сообщений: 2903
Регистрация: 26.11.2003
Где: Cutopia

Репутация: 10
Всего: 78

Alex_B,
да, хороший пример

--------------------

12345c

Дата 17.8.2007, 13:36 (ссылка)

(нет голосов)

Загрузка ...

Круглый

Профиль
Группа: Vingrad developer
Сообщений: 2018
Регистрация: 26.12.2005
Где: наша не пропадала ?

Репутация: 57
Всего: 101

Другой вариант решения - весь контент засунуть в див высотой с окно, а висящие изображения - вне этого дива.

1 Пользователей читают эту тему (1 Гостей и 0 Скрытых Пользователей)
0 Пользователей:
« Предыдущая тема \| JavaScript: Общие вопросы \| Следующая тема »