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

Поиск:

Ответ в темуСоздание новой темы Создание опроса
> окошко поверх страницы, с помощью div и стилей 
:(
    Опции темы
Valeria
Дата 28.12.2006, 10:48 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Опытный
**


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

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



как сделать окно,которое бы появлялось по кнопке в центре экрана поверх всего,что там есть.
только это не отдельное окно,а просто нарисованный прямоугольник с помощью стилей.
если конечно это возможно,при чем на нем будут различные кнопки,списки,поля.т.е. чтобы нажатие мышки на него реагировало.
и после закрытия все оставалось на экране как было. 
PM MAIL ICQ   Вверх
SHAmanovi4
Дата 28.12.2006, 10:59 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Шустрый
*


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

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



Сам пользую это творение. Но не обещаю ничего, потому как сам в JS не мастер. Но вроде работает везде, где проверял. У меня так. Можно убрать if в конце (этот иф решал задачку, чтобы окно появлялось на время, потом убиралось для вывода предупреждений или кратких сообщений).

Код

function my_win(el_id,is_close,el_width,el_height)    {
if (d.getElementById(el_id))    {
    var bod=d.getElementById('all_body');
    var win_x=bod.clientWidth;
    var win_y=bod.scrollTop;
    
    elem=d.getElementById(el_id);
    elem.style.left=(win_x/2-el_width/2);
    elem.style.top=(win_y+bod.clientHeight/2-el_height/2);
    elem.style.display='block';
    if(is_close)    {
        setTimeout("elem.style.display='none'",2000);
    }
}
else return false;
}



Код

<a href="javascript: my_win('win','0','200','200');">Ссылка</a>
<div id="win"><span onclick="d.getElementById('win').style.display='none';">[X]<br/>
Здесь любой контент.</div>


Единственный минус - ширина и высота элемента задаются жестко. Но нетрудно доработать, чтобы они определялись автоматически.

==============
Надеюсь поможет.
PM WWW ICQ   Вверх
Valeria
Дата 28.12.2006, 11:34 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Опытный
**


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

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



SHAmanovi4, у меня по ссылке ничего не создается  smile 
PM MAIL ICQ   Вверх
SHAmanovi4
Дата 28.12.2006, 18:40 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Шустрый
*


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

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



Код

#my_help   {display: none;}


Код

<span onclick="my_win('my_help',0,750,500);">Ссылка</a>
<div id="my_help">
<span id="close_help" onclick="d.all['my_help'].style.display='none';">[X]</span><br/>
Текст
</div>


Код

function my_win(el_id,is_close,el_width,el_height)    {
if (d.getElementById(el_id))    {
    var bod=d.getElementById('all_body');
    var win_x=bod.clientWidth;
    var win_y=bod.scrollTop;
    
    elem=d.getElementById(el_id);
    elem.style.left=(win_x/2-el_width/2);
    elem.style.top=(win_y+bod.clientHeight/2-el_height/2);
    elem.style.display='block';
    if(is_close)    {
        setTimeout("elem.style.display='none'",2000);
    }
}
else return false;
}




Так у меня было первоначально. Пытался подправить на ходу d.all[] заменить на d.getElementById(). Это нужно для кроссбраузерности. (сраный ФФ не понимает all). Еще не забудьте сделать запись:

var d=document;
PM WWW ICQ   Вверх
Valeria
Дата 29.12.2006, 10:29 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Опытный
**


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

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



вообще,я вчера сделала по-другому,просто добавила свойство position:absolute; и окошко поверх рисуется,только единственное
у меня грузятся swf файлы,которые это окошко перекрывают?! пытаюсь исправить  smile

Добавлено @ 10:33 
может,кто подскажет,что надо сделать?

Это сообщение отредактировал(а) Valeria - 29.12.2006, 10:34
PM MAIL ICQ   Вверх
SelenIT
Дата 30.12.2006, 17:30 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


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


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

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



Valeria, если есть возможность - задайте флэш-объектам параметр wmode со значением "opaque", должно решить проблему.

Если возникнет следующая проблема - налезание select-ов на "окошко" в IE - то в 6-й версии (и вроде бы даже в 5.5) она решается подкладыванием под "окошко" iframe того же размера.


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


Опытный
**


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

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



у меня флэшки вот так вот загружаются 

Код

<DIV><object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="300" height="160"><param  name="movie" value="'+url+'?dataUrl=data/Data.xml"><embed  src="'+url+'?dataUrl=data/Data.xml" width="300" height="160"></embed></object></DIV>'
    

на url не обращайте внимание. так вот,где здесь wmode надо прописать? или не здесь?
PM MAIL ICQ   Вверх
SelenIT
Дата 10.1.2007, 17:11 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


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


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

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



Valeria, как-то вот так:
Код

<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="300" height="160">
   <param  name="movie" value="'+url+'?dataUrl=data/Data.xml">
   <param  name="wmode" value="opaque">
   <embed  src="'+url+'?dataUrl=data/Data.xml" width="300" height="160" wmode="opaque"></embed>
</object>



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


Опытный
**


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

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



SelenIT,  smile 

работает. спасибо!!!!
PM MAIL ICQ   Вверх
Valeria
Дата 11.1.2007, 12:50 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Опытный
**


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

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



а теперь возникла задача сделать это окно перетаскиваемым?! поможете?

PM MAIL ICQ   Вверх
SelenIT
Дата 11.1.2007, 13:32 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


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


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

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



Valeria, зайдите в раздел JavaScript и поищите по словам "drag drop" - например, вот это и вот это (навскидку).


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


 




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


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

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