Модераторы: Illuminaty
  

Поиск:

Ответ в темуСоздание новой темы Создание опроса
> всплывающий DIV 
:(
    Опции темы
ОнКофе
Дата 25.4.2008, 20:33 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Опытный
**


Профиль
Группа: Участник
Сообщений: 274
Регистрация: 3.3.2006
Где: http://www.angeli na-pitt.by.ru

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



Можно ли создать такой DIV, который появлялся бы при нажатии на ссылку и заполнял собой всю страницу?

Например DIV содержит в себе полупрозрачный фон и изначально невидим, а когда мы нажимаем на ссылку, этот DIV становится видимым и через прозрачный фон видна вся страница. Проблема в том что не знаю как сделать подобный слой учитывая то что страница может иметь полосу прокрутка. Т.е. слой появляется, но прокрутив страницу вниз видно где заканчивается слой.  

вот пример...
Код

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
 "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
 <meta http-equiv="Content-Type" content="text/html; charset=windows-1251" />
 <title>Тест</title>
</head>
<body>
  <P>&nbsp</P><P>&nbsp</P><P>&nbsp</P><P>&nbsp</P><P>&nbsp</P><P>&nbsp</P><P>&nbsp</P><P>&nbsp</P>
  <P>&nbsp</P><P>&nbsp</P><P>&nbsp</P><P>&nbsp</P><P>&nbsp</P><P>&nbsp</P><P>&nbsp</P><P>&nbsp</P>
  <P>&nbsp</P><P>&nbsp</P><P>&nbsp</P><P>&nbsp</P><P>&nbsp</P><P>&nbsp</P><P>&nbsp</P><P>&nbsp</P>
  <P>&nbsp</P><P>&nbsp</P><P>&nbsp</P><P>&nbsp</P><P>&nbsp</P><P>&nbsp</P><P>&nbsp</P><P>&nbsp</P>
  <P>&nbsp</P><P>&nbsp</P><P>&nbsp</P><P>&nbsp</P><P>&nbsp</P><P>&nbsp</P><P>&nbsp</P><P>&nbsp</P>
  <P>&nbsp</P><P>&nbsp</P><P>&nbsp</P><P>&nbsp</P><P>&nbsp</P><P>&nbsp</P><P>&nbsp</P><P>&nbsp</P>
  <P>&nbsp</P><P>&nbsp</P><P>&nbsp</P><P>&nbsp</P><P>&nbsp</P><P>&nbsp</P><P>&nbsp</P><P>&nbsp</P>
  <P>&nbsp</P><P>&nbsp</P><P>&nbsp</P><P>&nbsp</P><P>&nbsp</P><P>&nbsp</P><P>&nbsp</P><P>&nbsp</P>
  <P>&nbsp</P><P>&nbsp</P><P>&nbsp</P><P>&nbsp</P><P>&nbsp</P><P>&nbsp</P><P>&nbsp</P><P>&nbsp</P>
  <P>&nbsp</P><P>&nbsp</P><P>&nbsp</P><P>&nbsp</P><P>&nbsp</P><P>&nbsp</P><P>&nbsp</P><P>&nbsp</P>
  <P>&nbsp</P><P>&nbsp</P><P>&nbsp</P><P>&nbsp</P><P>&nbsp</P><P>&nbsp</P><P>&nbsp</P><P>&nbsp</P>
  <P>&nbsp</P><P>&nbsp</P><P>&nbsp</P><P>&nbsp</P><P>&nbsp</P><P>&nbsp</P><P>&nbsp</P><P>&nbsp</P>

  <DIV style="position:absolute; top:0; left:0; height:101%; width:101%; background: #000000;">&nbsp;</DIV>
</body>


Слой заполняет только видимую часть экрана, а когда мы прокручиваем полосу прокрутки вниз, то видно где кончается слой. Есть ли способ заставить слой полностью заполнять страницу?

Это сообщение отредактировал(а) ОнКофе - 25.4.2008, 20:39
PM MAIL WWW   Вверх
SelenIT
Дата 25.4.2008, 20:39 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


баг форума
****


Профиль
Группа: Завсегдатай
Сообщений: 3996
Регистрация: 17.10.2006
Где: Pale Blue Dot

Репутация: 97
Всего: 401



Можно ему position:fixed поставить (а в IE6 - expression соответствующий). Или скриптом растянуть его до documentElement.clientHeight'а.


--------------------
Осторожно! Данный юзер и его посты содержат ДГМО! Противопоказано лицам с предрасположенностью к зонеризму!
PM MAIL   Вверх
ОнКофе
Дата 25.4.2008, 20:48 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Опытный
**


Профиль
Группа: Участник
Сообщений: 274
Регистрация: 3.3.2006
Где: http://www.angeli na-pitt.by.ru

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



ну при отключенных скриптах expression не работает, как впрочем и сами скрипты.... 
других возможностей нет?

попробовал 
Код

<DIV style="position:fixed; top:0; left:0; height:101%; width:101%; background: #000000;">&nbsp;</DIV>


работает но не везде.... ((
пошел пробовать document.body.offsetHeight+'px'
не поверю что без скриптов нельзя!

Это сообщение отредактировал(а) ОнКофе - 25.4.2008, 20:55
PM MAIL WWW   Вверх
SelenIT
Дата 25.4.2008, 21:10 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


баг форума
****


Профиль
Группа: Завсегдатай
Сообщений: 3996
Регистрация: 17.10.2006
Где: Pale Blue Dot

Репутация: 97
Всего: 401



Можно сделать top:0; bottom:0; и т.д., а для body (если div непосредственно в нем) - position:relative. Но работает это там же, где и position:fixed - т.е., AFAIK, везде кроме IE6-...

Для IE <7 есть еще трюк без скриптов с body { height:100%; overflow:hidden; } и вложенным в него дивом с height:100%; overflow:scroll.


--------------------
Осторожно! Данный юзер и его посты содержат ДГМО! Противопоказано лицам с предрасположенностью к зонеризму!
PM MAIL   Вверх
ОнКофе
Дата 25.4.2008, 21:14 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Опытный
**


Профиль
Группа: Участник
Сообщений: 274
Регистрация: 3.3.2006
Где: http://www.angeli na-pitt.by.ru

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



походу пора валить с работы домой, а то читаю и не могу догнать что же ты имел ввиду... ))
Спасибо за совет, при случае обязательно попробую. ))
PM MAIL WWW   Вверх
Itsys
Дата 25.4.2008, 23:03 (ссылка) |    (голосов:1) Загрузка ... Загрузка ... Быстрая цитата Цитата


Эксперт
***


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

Репутация: 9
Всего: 34



ОнКофе, Слушай, а как ты, при нажатии на ссылку, собираешься показать этот DIV без использования скриптов?
PM MAIL WWW Skype   Вверх
SelenIT
Дата 26.4.2008, 11:51 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


баг форума
****


Профиль
Группа: Завсегдатай
Сообщений: 3996
Регистрация: 17.10.2006
Где: Pale Blue Dot

Репутация: 97
Всего: 401



ОнКофе, суть трюка в том, чтобы спрятать скроллбар от body, заменив его скроллбаром дива-контейнера. По мне, изврат еще тот, зато без скриптов smile

Itsys, + за внимательность! Теоретически можно, конечно, извернуться с a:active, но это не вариант...


--------------------
Осторожно! Данный юзер и его посты содержат ДГМО! Противопоказано лицам с предрасположенностью к зонеризму!
PM MAIL   Вверх
  
Ответ в темуСоздание новой темы Создание опроса
0 Пользователей читают эту тему (0 Гостей и 0 Скрытых Пользователей)
0 Пользователей:
« Предыдущая тема | Вёрстка веб-сайтов | Следующая тема »


 




[ Время генерации скрипта: 0.0467 ]   [ Использовано запросов: 21 ]   [ GZIP включён ]


Реклама на сайте     Информационное спонсорство

 
По вопросам размещения рекламы пишите на vladimir(sobaka)vingrad.ru
Отказ от ответственности     Powered by Invision Power Board(R) 1.3 © 2003  IPS, Inc.