VPF::Открытие окна с автоматическим изменением размеров

korob2001

Дата 8.5.2005, 03:49 (ссылка)

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

Загрузка ...

Эксперт

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

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

Привет!!!
Пишу хелп для одной формы, возле каждого поля формы есть изображение с буквой ( i ), при нажатии на неё открывается новое окно, для этого окна программа на Perl генерирует HTML код, тело которого содержит только одну таблицу, внутри которой и находится сам хелп. Всё вроде чудно работает, но так как объём помощи для каждого поля разный, соответственно и высота таблицы тоже разная, нужно как-то автоматически изменять размер окна, в зависимости от его содержимого.
Вопрос:
Можно ли каким-нить способом открывать окно, с помощью window.open(), которое будет обхватывать эту таблицу так, что бы вокруг неё не оставалось пустого места???

Заранее спасибо,
Денис

Это сообщение отредактировал(а) korob2001 - 8.5.2005, 03:50

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

"Время проходит", - привыкли говорить вы по неверному пониманию.
"Время стоит - проходите вы".

Aliance

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

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

Загрузка ...

I ♥ <script>

Профиль
Группа: Модератор
Сообщений: 6418
Регистрация: 2.8.2004
Где: spb

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

Читаем размеры таблицы, подставляем их в третий аргумент метода:
http://www.quirksmode.org/viewport/compatibility.html
http://forum.vingrad.ru/index.php?showtopic=37271
http://forum.vingrad.ru/index.php?showtopic=2785
http://forum.vingrad.ru/index.php?showtopic=4463
http://forum.vingrad.ru/index.php?showtopic=2786
Там можно найти полезный вещи. Не получится - пиши. И желательно выложи код... Код открытия окна и HTML код, получаемый браузером при обработке perl скрипта

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

• Все о событиях
• Объекты и массивы
• ОКНА И ФРЕЙМЫ

JAVA ≠ JavaScript

korob2001

Дата 8.5.2005, 10:59 (ссылка)

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

Загрузка ...

Эксперт

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

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

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

Код


onclick="window.open('/cgi-bin/nl/sys/faq.pl?faq=1','10','width=450 height=280 resizable=no, menubar=no, scrollbars=auto, location=no, status=no, toolbar=no'); return false"

Открывается, к примеру, такая страничка:

Код


<?xml version="1.0" encoding="iso-8859-1"?>
<!DOCTYPE html
    PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
     "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en-US" xml:lang="en-US">
     <head>
        <title> FAQ</title>
     </head>
<body leftmargin="0" rightmargin="0" bottommargin="0" bgcolor="#ccccff" topmargin="0">
     <table width="100%" border="0" cellspacing="0" cellpadding="0" bgcolor="#9999cc">
           <tr><td width="100%" bgcolor="#0000cc">
                   <table width="100%" border="0" cellspacing="0" cellpadding="5">
                           <tr><td>
                              <b class="mnutit">Help page №1</b>
                           </td></tr>
                   </table>
           </td><td width="1" rowspan="2" bgcolor="#000000">
                    <img src="/mob/img/no.gif" width="1">
           </td></tr>
           <tr><td width="100%">
                   <table width="100%" border="0" cellspacing="0" cellpadding="5">
                              <tr><td align="left" bgcolor="#9999cc">
                                    <b><font class='small'>В поле Merk вы должны указать марку
                                      вашего автомобиля, как показано на рисунке ниже:</font></b>
                                     <br><br>
                                    <img src="/mob/faqimg/veld_merk.gif" border='0'>
                                   <br><br>
                                    
                                   <hr color="#0000cc" style="border-weight: 1px" />
                              <form>
                    <input type="button" value="Закрыть окно" onclick="window.close()class="but" />
                   </form>
                  </td></tr>
                  </table>
          </td></tr>
     </table>
</body></html>

Так вот, из первого кода видно, что высота нового окна height=280, а мне нужно что бы эта высота соответствовала высоте таблицы, второго кода, т.е. что бы не оставалось пустого места внизу открываемого окна.

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

"Время проходит", - привыкли говорить вы по неверному пониманию.
"Время стоит - проходите вы".

Aliance

Дата 8.5.2005, 13:08 (ссылка)

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

Загрузка ...

I ♥ <script>

Профиль
Группа: Модератор
Сообщений: 6418
Регистрация: 2.8.2004
Где: spb

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

Цитата(korob2001 @ 8.5.2005, 11:59)

да нет, меня не разрешение интересует.

иам не только разрешение. Там есть и размеры блока - например scrollLeft

korob2001
Вот, посмотри, выбири что тебе нужно. Я бы советовал бы scrollHeight:

Код


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<script type="text/javascript" language="JavaScript">
<!--
function showHeight(id) {
 var table = document.getElementById(id);
 var text = "scrollHeight: "+table.scrollHeight;
 text += "\ninnerHeight: "+table.innerHeight;
 text += "\nclientHeight: "+table.clientHeight;
 text += "\noffsetHeight: "+table.offsetHeight;
 alert(text);
}
// -->
</SCRIPT>
</HEAD>

<BODY>

<TABLE border=1 id="mytable">
<TR>
<TD>111</TD>
<TD>22222</TD>
</TR>
<TR>
<TD>3</TD>
<TD>4444444444</TD>
</TR>
</TABLE>

<BR /><p><INPUT type="button" value="^^^ Посмотреть высоту таблицы ^^^" onclick="showHeight('mytable')" /></p>

</BODY>
</HTML>

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

• Все о событиях
• Объекты и массивы
• ОКНА И ФРЕЙМЫ

JAVA ≠ JavaScript

Sardar

Дата 8.5.2005, 16:18 (ссылка)

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

Загрузка ...

Бегун

Профиль
Группа: Модератор
Сообщений: 6986
Регистрация: 19.4.2002
Где: Нидерланды, Groni ngen

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

korob2001 узнаёшь свою высоту как показал Aliance, либо сам решаешь какая высота лучше, затем вызываем self.resizeTo(W, H), тем самым подгоняем размер окна.

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

Опыт - сын ошибок трудных © А. С. Пушкин
Процесс написания своего велосипеда повышает профессиональный уровень программиста. © Opik
Оценить мои качества можно тут.

korob2001

Дата 9.5.2005, 05:48 (ссылка)

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

Загрузка ...

Эксперт

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

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

Спасибо, вроде немного понял, но видимо не до конца.

Выношу в отдельный файл main.js, такую функцию:

Код


function selfResizer( id ) {
     table = document.getElementById( id );
     h = table.scrollHeight;
     // Так как ширина всегда остаётся 450, изменяю только высоту
     self.resizeTo(450, h);
}

Вешаю её на событие onLoad открываемого окна <body onLoad="selfResizer('s')">, где s - id таблицы, по которой мне нужно отрегулировать размер окна <table id="s">, но почему-то всё эта байда не работает smile

. Думаю проблема в self, насколько я понимаю это объект текущего окна. Пробовал написать последнюю строку и так: window.resizeTo(450, h); smile

Что не так???

Это сообщение отредактировал(а) korob2001 - 9.5.2005, 05:51

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

"Время проходит", - привыкли говорить вы по неверному пониманию.
"Время стоит - проходите вы".

Sardar

Дата 9.5.2005, 11:55 (ссылка)

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

Загрузка ...

Бегун

Профиль
Группа: Модератор
Сообщений: 6986
Регистрация: 19.4.2002
Где: Нидерланды, Groni ngen

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

self и window указывают на текущее окно(синонимы). Судя по коду всё правильно, как "трабла" себя проявляет?

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

korob2001

Дата 9.5.2005, 14:05 (ссылка)

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

Загрузка ...

Эксперт

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

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

Во, вроде заработало, просто я тестировал похоже не с тем окном. А почему этот код не изменяет размеры, если окно модальное???

Открываю окно так:

Код


function winOpener( id, urlz ) {
       window.showModalDialog( urlz,[], "dialogHeight: 50px; dialogWidth: 450px; dialogHide: yes; help=no; status=no; edge=raised; unadorned=yes; scroll=no");
       return false;
}

затем в на onLoad только что открытого окна вешаю тот же код:

Код


function selfResizer( id ) {
     table = document.getElementById( id );
     h = table.scrollHeight + 30;
     window.resizeTo(450, h);
}

Но размеры его не изменяются, хотя если заменить строку кода, которая отрывает модальное окно на window.open(.....) (обычное окно), то всё работает.

Просто мне желательно, что бы эти окна открывались как модальные, так как это делаю в виде СПРАВКИ, чел не понял что делать с тем или иным полем, открыл окно, прочитал закрыл.

Это сообщение отредактировал(а) korob2001 - 9.5.2005, 14:08

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

"Время проходит", - привыкли говорить вы по неверному пониманию.
"Время стоит - проходите вы".

Sardar

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

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

Загрузка ...

Бегун

Профиль
Группа: Модератор
Сообщений: 6986
Регистрация: 19.4.2002
Где: Нидерланды, Groni ngen

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

Цитата(korob2001 @ 9.5.2005, 13:05)

А почему этот код не изменяет размеры, если окно модальное???

Возможно это фича, модальное окно открывается, останавливая исполнение и лочиться в размерах. Попробуй не задать размеры(dialog(Width|Height)) при открытии окна.

Цитата(korob2001 @ 9.5.2005, 13:05)

ак как это делаю в виде СПРАВКИ, чел не понял что делать с тем или иным полем, открыл окно, прочитал закрыл.

Почему справка должна открываться в модальном окне? Представь что я читаю справку и выполняю по шагам, что там написанно, не закрывая окна. С модальным окном так не получиться, йзеру придётся часто окно открывать-читат и закрыватЬ-работать, пока его это не задолбает smile

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

Aliance

Дата 9.5.2005, 17:14 (ссылка)

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

Загрузка ...

I ♥ <script>

Профиль
Группа: Модератор
Сообщений: 6418
Регистрация: 2.8.2004
Где: spb

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

Да и потом работать они будут только в IE.

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

• Все о событиях
• Объекты и массивы
• ОКНА И ФРЕЙМЫ

JAVA ≠ JavaScript

korob2001

Дата 9.5.2005, 20:03 (ссылка)

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

Загрузка ...

Эксперт

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

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

Цитата

Попробуй не задать размеры(dialog(Width|Height)) при открытии окна.

Не изменяет размеры модальных окон. smile

Цитата

Почему справка должна открываться в модальном окне?

Каждое поле имеет свою справку, которую генерирует один и тот же Perl скрипт, допустим юзер вызвал справку для первого поля, окно отрылось, он прочитал её и вместо того, что бы закрыть окно справки, он просто уберает с него фокус. Затем он вызывает справку для какого-нить следующего поля, но так как окно уже открыто, справка загрузится в это окно, проблема в том, что оно так и остаётся свёрнутым, информация в нём правда меняется, но нужно не забыть, что окно было опущено, а не закрыто. Иначе он даже не заметит, что справка была вызвана и показана.
Я вот думал сначала, узнать открыто ли окно спавки или нет, если да, то загружать в него следующую справку и тут же переводить на него фокус. Тогда спавка будет появляться не зависимо от того было ли окно свёонуто или закрыто. Затем подумал ещё чуток и вот до чего додумался:
Так как код, который изменяет размеры окна, вызывается из открываемого окна, т.е. этот код:

Код


function selfResizer( id ) {
     table = document.getElementById( id );
     h = table.scrollHeight + 30;
     window.resizeTo(450, h);
}

То решил при каждом вызове данной функции просто переводить фокус на текущее окно, т.е. на окно справки.

Код


function selfResizer( id ) {
     self.focus();
     table = document.getElementById( id );
     h = table.scrollHeight + 30;
     window.resizeTo(450, h);
}

Теперь даже если окно было свёрнуто, а не закрыто, то при последующем вызове оно получает фокус, что и было нужно. Потому нужда в модальных окнах отпала сама собой.

Всем большое спасибо, очень помогли.

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

"Время проходит", - привыкли говорить вы по неверному пониманию.
"Время стоит - проходите вы".

Aliance

Дата 9.5.2005, 21:19 (ссылка)

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

Загрузка ...

I ♥ <script>

Профиль
Группа: Модератор
Сообщений: 6418
Регистрация: 2.8.2004
Где: spb

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

Цитата(korob2001 @ 9.5.2005, 21:03)

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

Код


var newWindow;
function makeNewWindow(url) {
    if (!newWindow || newWindow.closed) {
        newWindow = window.open(/* твои параметры */);
    } else {
        // окно уже существсует => просто передаем ему фокус
        newWindow.focus();
    }
}

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

• Все о событиях
• Объекты и массивы
• ОКНА И ФРЕЙМЫ

JAVA ≠ JavaScript

korob2001

Дата 9.5.2005, 21:59 (ссылка)

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

Загрузка ...

Эксперт

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

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

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

Код


function selfResizer( id ) {
     self.focus();
     table = document.getElementById( id );
     h = table.scrollHeight + 30;
     window.resizeTo(450, h);
}

Эта функция висит на событии onLoad, документа, который подгружается в окне. Другими словами, если окно уже открыто, то при клике на следующей кнопке HELP в него загружается нужная справка. Текущее, т.е. окно в котором выводится сама справка, получает фокус и затем меняет свои размеры в зависимости от размера единственной таблицы текущего документа. Если же окно было закрыто, то просто открывается окно со справкой, затем оно получает фокус и меняет свои размеры.

Всё работает на ура. ;))))
Ещё раз спасибо.

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

"Время проходит", - привыкли говорить вы по неверному пониманию.
"Время стоит - проходите вы".

Vigoroso

Дата 10.4.2008, 12:15 (ссылка)

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

Загрузка ...

Шустрый

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

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

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

bars80080

Дата 10.4.2008, 12:54 (ссылка)

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

Загрузка ...

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

Награды: 1

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

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

вообще это нормально, что информация подстраивается под размер окна, а не наоборот
если вы знаете объём инфо, то можно при открытии окна задавать предполагаемые размеры, если не знаете, то можно js определить, скажем местоположение контрольного блочка, т.е.

информация выводится в окне в каком-нибудь диве

Код

<div id="info">
help information help information help information help information help information 
help information help information help information help information help information 
<div id="control"></div>
</div>

определяем положение блока control (вроде offsetTop), и ресайз окна в нужную сторону

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