VPF::всплывающее окно - Форум программистов

godvinn

Дата 4.3.2009, 14:18 (ссылка)

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

Загрузка ...

Опытный

Профиль
Группа: Участник
Сообщений: 407
Регистрация: 4.4.2008
Где: possibility of mo ving to Kyiv

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

Привет всем. Есть такой вопрос:
Есть сайт, как сделать чтобы можно было вызвать окно c помощью клавиш клавиатуры, то есть при нажатии например Ctrl+Q появляется окно размером 300*500 с какойто информацией.

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

Everything happens in life.

Soah

Дата 4.3.2009, 15:23 (ссылка)

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

Загрузка ...

Опытный

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

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

В Опере Ctrl+Q это выход, вот для Shift+Q

Код


<script type="text/javascript">
    document.onkeydown = function (event) {
        event = event || window.event;
        var keyCode = event.which || event.keyCode;

        if (event.shiftKey && keyCode == 81)
            window.open("idd.htm", "NewWindow", "width=300, height=500");
    }
</script>

godvinn

Дата 5.3.2009, 09:09 (ссылка)

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

Загрузка ...

Опытный

Профиль
Группа: Участник
Сообщений: 407
Регистрация: 4.4.2008
Где: possibility of mo ving to Kyiv

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

а как вместо window.open("idd.htm", "NewWindow", "width=300, height=500"); вставить модальное окно наподобие вот того (в приложениии)?

Присоединённый файл ( Кол-во скачиваний: 23 )

111.JPG 79,05 Kb

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

Everything happens in life.

bars80080

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

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

Загрузка ...

прапор творюет

Награды: 1

Профиль
Группа: Завсегдатай
Сообщений: 12022
Регистрация: 5.12.2007
Где: Königsberg

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

открыть не окно, а скрытый слой. полупрозрачный iframe на весь экран для блокировки и сверху див, содержащий эту форму

godvinn

Дата 5.3.2009, 11:26 (ссылка)

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

Загрузка ...

Опытный

Профиль
Группа: Участник
Сообщений: 407
Регистрация: 4.4.2008
Где: possibility of mo ving to Kyiv

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

bars80080, а можешь примерчик привести ? Пожалуйста.

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

Everything happens in life.

bars80080

Дата 5.3.2009, 11:51 (ссылка)

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

Загрузка ...

прапор творюет

Награды: 1

Профиль
Группа: Завсегдатай
Сообщений: 12022
Регистрация: 5.12.2007
Где: Königsberg

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

что-то вроде такого:

Код


<style>
#odeka { display: none; position: fixed; left: 0px; top: 0px; width: 100%; height: 100%;
    background: #fff8ff; filter: alpha(opacity=70, finishopacity=70); opacity: .7; }

#odeka iframe { width: 50%; height: 100%; }

#dop { display: none; position: fixed; left: 100px; top: 100px; width: 75%; background: #eeeeff; }
* html #dop { position: absolute; width: 150%; }
* html #odeka { position: absolute; width: 199%; height: 800px; }
* html #odeka iframe { width: 100%; }
</style>

<div id="odeka"><iframe></iframe></div>

<div id="dop">
... форма
</div>

только там надо посмотреть как ведут себя проценты ширины. я подгонял под свои запросы, а у меня почему-то получалось, что надо задать для ИЕ6 150% и 200%

#odeka { display: none;
#dop { display: none; - по-умолчанию не видны. javascript открывает по нажатию кнопки

godvinn

Дата 5.3.2009, 14:10 (ссылка)

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

Загрузка ...

Опытный

Профиль
Группа: Участник
Сообщений: 407
Регистрация: 4.4.2008
Где: possibility of mo ving to Kyiv

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

то есть вот такое должно выйти

Код


<html>

<head>

<script type="text/javascript">
    document.onkeydown = function (event) {
        event = event || window.event;
        var keyCode = event.which || event.keyCode;
        if (event.shiftKey && keyCode == 81)
    {
        document.getElementById("dop");
    }
            
    }
</script>

<style>
    #odeka { display: none; position: fixed; left: 0px; top: 0px; width: 100%; height: 100%;
    background: #fff8ff; filter: alpha(opacity=70, finishopacity=70); opacity: .7; }
    #odeka iframe { width: 50%; height: 100%; }
    #dop { display: none; position: fixed; left: 100px; top: 100px; width: 75%; background: #eeeeff; }
    * html #dop { position: absolute; width: 150%; }
    * html #odeka { position: absolute; width: 199%; height: 800px; }
    * html #odeka iframe { width: 100%; }
</style>    
    
</head>

<body>

<div id="odeka"><iframe></iframe></div>

<div id="dop">
... форма
</div>

</body>

</html>

?

Это сообщение отредактировал(а) godvinn - 5.3.2009, 14:10

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

Everything happens in life.

bars80080

Дата 5.3.2009, 14:25 (ссылка)

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

Загрузка ...

прапор творюет

Награды: 1

Профиль
Группа: Завсегдатай
Сообщений: 12022
Регистрация: 5.12.2007
Где: Königsberg

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

я так понимаю:

Код


        if (event.shiftKey && keyCode == 81)
    {
        document.getElementById("odeka").style.display = 'block';
        document.getElementById("dop").style.display = 'block';
    }

Photon

Дата 5.3.2009, 18:58 (ссылка)

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

Загрузка ...

Злобный программер

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

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

Нафиг писать что-то свое для вывода модальных окон, если есть вещи типа jQuery или MooTools?

В случае с jquery это будет так:

Подключаем jquery.js и impromptu.js (плагин для jQuery), а также impromptu.css

А потом:

Код


document.onkeydown = function (event) {
   event = event || window.event;
   var keyCode = event.which || event.keyCode;

   if (event.shiftKey && keyCode == 81) {
      $.prompt('Тут нужное содержимое окна в виде HTML', {buttons: {'Ok': true, 'Cancel': false}, callback: fn_CallBack});
      function fn_CallBack (v,m) { 
          if (!v) return false;
/*
                 тут какие-нить полезные действия
                 например, отправка данных формы, которая была выведена в диалоговом окне
                 примерно так:
                 var form = m.find('#myForm');
                 form.submit();                 

*/
      }
   }
}

Это сообщение отредактировал(а) Photon - 5.3.2009, 19:01

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

With best regards..

bars80080

Дата 5.3.2009, 21:27 (ссылка)

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

Загрузка ...

прапор творюет

Награды: 1

Профиль
Группа: Завсегдатай
Сообщений: 12022
Регистрация: 5.12.2007
Где: Königsberg

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

Цитата(Photon @ 5.3.2009, 17:58

)

Нафиг писать что-то свое для вывода модальных окон, если есть вещи типа jQuery или MooTools?

а нафиг использовать jQuery или MooTools, если можно написать самому?

godvinn

Дата 6.3.2009, 12:11 (ссылка)

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

Загрузка ...

Опытный

Профиль
Группа: Участник
Сообщений: 407
Регистрация: 4.4.2008
Где: possibility of mo ving to Kyiv

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

bars80080, А как добавить кнопку кенсел чтобы закрывалось это окно ? нужно window.close()?
все уже разобрался ))) smile

Это сообщение отредактировал(а) godvinn - 6.3.2009, 12:39

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

Everything happens in life.

godvinn

Дата 6.3.2009, 13:22 (ссылка)

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

Загрузка ...

Опытный

Профиль
Группа: Участник
Сообщений: 407
Регистрация: 4.4.2008
Где: possibility of mo ving to Kyiv

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

зкрываю окно вот так

Код


    document.getElementById("odeka").style.display = 'none';
    document.getElementById("form_send").style.display = 'none';

но, если пользователь ничего не вводит в форму ему постоянно вылезает сообщение о том что вы не отправли данные хотите отправить ? как сделать чтобы этого сообщения не было?

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

Everything happens in life.

Photon

Дата 7.3.2009, 00:35 (ссылка)

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

Загрузка ...

Злобный программер

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

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

bars80080, как минимум потому, что в случае вашей реализации форма и прочее остаются в коде страницы и могут происходить всяческие неприятные вещи.. Особенно при неверном написании той части кода, которая работает с этой формой..

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

With best regards..

bars80080

Дата 7.3.2009, 00:44 (ссылка)

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

Загрузка ...

прапор творюет

Награды: 1

Профиль
Группа: Завсегдатай
Сообщений: 12022
Регистрация: 5.12.2007
Где: Königsberg

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

Цитата(Photon @ 6.3.2009, 23:35

)

Особенно при неверном написании той части кода, которая работает с этой формой..

так же как при неверном написании вызова вашего метода от jquery. причём, чем универсальней плагин, тем тяжелее он для модификаций под нестандартные решения

пример прост: кнопка "код" в форме этого форума. до сих пор её не могут модифицировать в две колонки. библиотека, так её и так

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