Здравствуйте.
Задача:

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

вопросы:
1) Как его убрать при нажатии в любом другом месте страницы?
2) Насколько кроссброузерен и универсален данный вариант?
3) В правильном ли я двигаюсь направлении при решении данной задачи?



Заранее спасибо.

<body onclick="document.getElementById('s1').style.visibility='hidden'">

bars80080, спасибо тебе большое. Постоянно выручаешь. 
Но я так пробовал уже, не работает. Див вообще не раскрывается при нажатии на кнопку. Кнопка же тоже в теле документа находится.
К тому же что делать если таких кнопок с дивами будет несколько и разных?

Это сообщение отредактировал(а) Wheels - 10.11.2008, 17:02

может вообще идея крамольная с боди, но если всё же с ним, то <body onclick="prov();">

а в функции prov(); во-первых проверка какие дивы открыты и их закрытие (просто при открытие дива в общем массиве менять значение флага, а потом проверять в цикле)



но скорее всего выход такой: 
твой див - это слой, растягивающийся на весь экран, в середине окошко, которое тебе нужно, всё остальное - прозрачный слой, по которому можно осуществить клик. при этом можно даже задать не прозрачный слой, а фон в виде полупрозрачного png, тогда будет красивое затенение сайта

Спасибо! )

Ой...
Можно хоть как-нибудь в примере, пожалуйста?
Я же в раздел для начинающих пишу =)

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


Это сообщение отредактировал(а) Wheels - 10.11.2008, 17:49

самое простое - заготовить такой слой заранее. располагаться он должен перед </body> и желательно иметь нужные характеристики. т.е. растянут по всей ширине с помощью css. только быть невидимым:



конечно, тут возможны подводные камни в зависимости от ситуации.

по нажатию кнопки просто берётся разметка нужного тебе окна и вставляется в qw, затем он открывается:

это конечно жутко упрощённо. но хотя бы идея

Во, наваял:...выглядит пример конечно отстойно, но... работает 

Michael.de, спасибо огромное, но к сожалению это не совсем то, что мне нужно =((


bars80080, Во, как раз так! Вроде разобрался... мне нравится и даже в разных броузерах работает ) Только 1 нюанс остался... 
Как открываемый див к "родительской" кнопке прилепить? Пробовал по-всякому, но какая-то белеберда получается, все зависимости от местоположения и дива и кнопки в коде. Нужно координаты кнопки узнавать? Или можно приемами верстки ограничиться? У меня уже дошло до маразма ;) &nbsp; и nobr =)))

нет, но если ты имеешь возможность затенить всю страницу, то див тупо должен быть в центре

насчёт определения координат элемента (кнопки), то можно посмотреть здесь http://xhtml.ru/2006/08/23/cursor-coordinates/
там есть пару функций: 
которые можно подкорректировать под свои задачи

Как так? И координаты кнопки не придется узнавать? Меня этот вариант наверное устроил бы. Т.е. тот, что проще.  Только я тебя не очень понимаю... что значит в центре?  А если кнопок много? А если дизайн страницы "резиновый"? Я, наверное, не совсем суть самой идеи понимаю от того, что не имею в голове представления КАК это будет работать =((

В любом случае - спасибо за ссылку, буду разбираться пока что.

Это сообщение отредактировал(а) Wheels - 11.11.2008, 11:29

ну смотри. когда у тебя вылетает alert(), то ничего кроме как на его конпку на странице ты нажать не можешь. если у тебя див с сообщением открывается и приэтом любое нажатие на остальную часть страницы вызывает его закрытие, то самое логичное - разместить его в центре, и при этом затенить страницу (в иделае, она должна поблекнуть - png полупрозрачный поверху)

Ясно. Т.е. в любом случае Див будет по центру.  Но он нужен прямо от кнопки, где бы она ни находилась, как на изображении. Нужно пробовать разместить его, узнав координаты верхнего левого угла кнопки, так? Или есть другие способы добиться этого?

В результате размышлений и пары экспериментов я пришел к выводу, что нужно иметь див фиксированной высоты, так? С прокруткой... Ведь, его левый нижний угол нужно "прилепить" левому верхнему углу кнопки...   А на тот случай, если див широкий, а кнопка у самого правого борта страницы - еще и фиксированную ширину дива, что бы не уезжал за край страницы, а отъехал влево немного.

Я правильно размышляю?

Это сообщение отредактировал(а) Wheels - 11.11.2008, 21:13

чёрт его знает. сделай чёнибуть. а там посмотришь, нравится или нет

Сделал. Не нравится =(

При появлении дивов возникает вертикальная и/или горизонтальная прокрутка на странице. Не знаю как от нее избавиться.
С чем это связано? 
В IE дивы закрываются "через раз". При клике на кнопку закрываются на сотый раз, если вообще закрываются.
В чем тут проблема?

И еще не могу понять как сделать id кнопкам такого вида: butt[0]; а в функциях    findPosX(document.getElementById(x)); вместо x писать butt[x]. Но тут просто с синтаксисом не разобрался...