Есть такой код:

Код

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <meta http-equiv="Content-Type" content='text/html; charset=windows-1251' /> <meta name="Generator" content='EditPlus 2.12' /> <meta name="Author" content='Ciber SLasH' /> <title>JavaScript :: Пример работы "window.open()"</title> <script type='text/javascript'> /*** Открытие нового окна с изображением *(ver 1)**/ function showImg_1(URL, imgPath, type) { var img = new Image();   img.src = imgPath;   var h = img.height;   var w = img.width;   var imgHTML = '<img style="position: absolute; left: 0px; top: 0px" src="'+img.src+'">';   var wnd = window.open(URL, 'newWnd', 'width='+w+',height='+h);   if (type != undefined) {     switch (type) {       case "add":         wnd.document.body.innerHTML += imgHTML; break;     }   }   else {     wnd.document.write(imgHTML);     wnd.document.title = 'JavaScript :: "window.open()" [метод: write]';     wnd.document.close();   } } </script> </head> <body> <fieldset><legend> showImg (ver 1)</legend> <button onClick='showImg_1("", "file://E:/Мои доки/Мои рисунки/Xakep images/Xak_logo.JPG")' title="Без URL [метод: write]">Картинка №1</button> <button onClick='showImg_1("OpenWindow_addon.htm", "file://E:/Мои доки/Мои рисунки/Xakep images/xak.JPG", "add")' title="URL=OpenWindow_addon.htm [метод: add]">Картинка №2</button> </fieldset> </body> </html>

OpenWindow_addon.htm:

Код

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <meta http-equiv="Content-Type" content='text/html; charset=windows-1251' /> <meta name="Generator" content='EditPlus 2.12' /> <meta name="Author" content='Ciber SLasH' /> <title>JavaScript :: "window.open()" [метод: add]</title> <style type='text/css'> div {     position: absolute;     z-index: 1;     left: 25%;     top: 10px;     width: 50%;     height: 10%;     padding-top: 3%;     border: 3px solid red;     background: navy;     color: lime;     font-weight: bold;     filter: alpha(opacity=80); } </style> </head> <body> <div align="center">Картинка, открытая другим документом</div> </body> </html>

но почему-то в Опере и Лисе первая кнопка глючит (в IE всё нормально). А в Лисе и вторая глючит.
Не пойму почему при нажатии первой кнопки в Опере и Лисе открывается новое окно, но в строке загрузке прогресс никак не может завершиться (виснет).

Как побороть глюк с первой кнопкой в Опере и Лисе ?
И если кто знает, то и вторую кнопку немешало бы исправить в Лисе...
Для того, чтобы посмотреть как должно быть — смотреть сначала в IE.

Это сообщение отредактировал(а) Ciber SLasH - 13.11.2005, 07:18

во первых это плохая идея создавать картинку, а потом сразу же опрашивать её размеры. Только спустя некоторое время, когда хотя бы заголовок картинки загрузиться, тогда и будут доступны размеры. Совет: поставь обработчика на событие onload у картинки или у body(если баннеров медленных нет), в обработчике расширяй окно. Ещё лучше хранить размеры в базе, при показе картинки сразу задавать окну нужный стартовый размер.

Во вторых Опера и Лиса свято чтут стандарты и логику документов, а ими могут быть не только HTML документы. Сразу после открытия window.open ещё никаких body не существует, единственный обьект в DOM дереве должен быть document. Xотя document.documentElement существовать будет и это html элемент, вот ему можешь изменять innerHTML.

Пробовал делать: wnd.document.documentElement.innerHTML = imgHTML
но ничего не вышло...

IE грит: "Не удалось установить свойство innerHTML. Недопустимый конечный элемент для данного действия."
Opera: "Could not convert undefined or null to object"

Пробовал так:
img1 = wnd.document.createElement('IMG')
img1.src = img.src
wnd.document.appendChild(img1)

и опять ничего:
IE: молчит, открыв пустое окно
Opera: "Unhandled exception: [Object DOMException]"

Как же победить?

Всё оказалось гораздо проще, нужно было после строк:

Код

wnd.document.write(imgHTML); wnd.document.title = 'JavaScript :: "window.open()" [метод: write]';

добавить:

Код

wnd.document.close();

ЗЫ: ответ нашёл через поисковик, здесь: http://forum.mozilla.ru/viewtopic.php?id=1725

Это сообщение отредактировал(а) Ciber SLasH - 13.11.2005, 07:21

document.write теоретически запрещён в XHTML, хотя open/write/close процесс, т.е. написать чистый документ по моему можно.

Странно что document.documentElement ругнулся. Для обоих, innerHTML и write нужно контент вписывать в <body> теги, хотя браузер на отсутствие не ругнёться.

Всё-таки в Лисе глючит при открытии окна: окно неполностью подстраиватся под изображение как через функцию showImg_1(), так и через showImg_2().

Код

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <meta http-equiv="Content-Type" content='text/html; charset=windows-1251' /> <meta name="Generator" content='EditPlus 2.12' /> <meta name="Author" content='Ciber SLasH' /> <title>JavaScript :: Пример работы "window.open()"</title> <script type='text/javascript'> /*** Открытие нового окна с изображением *(ver 1)**/ function showImg_1(URL, imgPath, type) { var img = new Image();   img.src = imgPath;   var w = img.width;   var h = img.height;   var left = screen.availWidth/2 - w/2;   var top = screen.availHeight/2 - h/2;   var imgHTML = '<img style="position: absolute; left: 0px; top: 0px" src="'+img.src+'">';   var wnd = window.open(URL, 'newWnd', 'width='+w+',height='+h+',left='+left+',top='+top+',screenX='+left+',screenY='+top);   if (type != undefined) {     switch (type) {       case "add":         wnd.document.body.innerHTML += imgHTML; break;     }   }   else {     wnd.document.write('<html><head><title>JavaScript :: "window.open()" [метод: write]</title></head><body>'+imgHTML+'</body></html>');     wnd.document.title = 'JavaScript :: "window.open()" [метод: write]';     wnd.document.close();   } } /*** Открытие нового окна с изображением *(ver 2)**/ function showImg_2(URL, imgPath) { var img = new Image();   img.src = imgPath;   var w = img.width;   var h = img.height;   var left = screen.availWidth/2 - w/2;   var top = screen.availHeight/2 - h/2;   var content = '<html><head><title>JavaScript :: "window.open()" [dynamic content]</title>' +                 '<script type="text/javascript">' +                 'function selfResizer(id) {' +                 'var obj = document.getElementById(id);' +                 'var w = obj.width;' +                 'var h = obj.height;' +                 'var left = screen.availWidth/2 - w/2;' +                 'var top = screen.availHeight/2 - h/2;' +                 '  window.resizeTo(w, h);' +                 '  window.moveTo(left, top);' +                 '}' +                 '<\/script>' +                 '</head><body onLoad="selfResizer(\'foto\')">' +                 '<img id="foto" style="position: absolute; left: 0px; top: 0px" src="'+img.src+'">' +                 '</body></html>';   var wnd = window.open(URL, 'newWin', 'width='+w+',height='+h+',left='+left+',top='+top+',screenX='+left+',screenY='+top);   wnd.document.write(content);   wnd.document.close(); } </script> </head> <body> <fieldset><legend> showImg (ver 1)</legend> <button onClick='showImg_1("", "file://E:/Мои доки/Мои рисунки/Xakep images/Xak_logo.JPG")' title="Без URL [метод: write]">Картинка №1</button> <button onClick='showImg_1("about:blank", "file://E:/Мои доки/Мои рисунки/Xakep images/logo.gif")' title="URL=about:blank [метод: write]">Картинка №2</button> <button onClick='showImg_1("OpenWindow_addon.htm", "file://E:/Мои доки/Мои рисунки/Xakep images/xak.JPG", "add")' title="URL=OpenWindow_addon.htm [метод: add]">Картинка №3</button> </fieldset> <fieldset><legend>showImg (ver 2)</legend> <button onClick='showImg_2("", "file://E:/Мои доки/Kartinki/Humor/Matrix/matrisa-ukraina.jpg")' title="Без URL [dynamic content]">Картинка №1</button> </fieldset> <fieldset><legend>window.open() с полноценным окном</legend> <input type="button" onClick='window.open("file://E:/Мои доки/Мои рисунки/Знак 3.GIF", "newWnd", "width=640,height=480,alwaysRaised,directories,location,menubar,resizable,scrollbars,status,toolbar").document.title = "JavaScript :: \"window.open()\" [метод: write]"' value="Картинка №1"> </fieldset> <div id='log'></div> </body> </html>

как победить?

Я же говорил что у тебя на локалке(+ картинка в кеше) скрипт работает, но как только загрузишь в нет, сразу облажаешся, т.к. размеры картинки на момент опроса ещё не доступны.

Думаем логически, размеры нужно увеличивать когда картинка загрузиться, следовательно <img onload="window.setSize(this.offsetWidth, this.offsetHeight)">

При этом выставляем body и html стили margin: 0px; padding: 0px, либо учитываем маржины в размерах окна.

Ещё заметил, что хоть и прописан <title>...</title> через document.write(), а всё равно в Лисе не отображается.
Приходится дополнительно прописывать через document.title
Добавлено @ 01:02
Дык у меня ж в функции showImg_2() открывается окно с сгенерённым контентом, в котором по событию body.onLoad вызывается функция selfResizer(), которая и делает всё.
Тока не правильно работает в Лисе.

Переписал всё снова...
Теперь первая функция для картинок с известным размером, а вторая — с неизвестным.

Код

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <meta http-equiv="Content-Type" content='text/html; charset=windows-1251' /> <meta name="Generator" content='EditPlus 2.12' /> <meta name="Author" content='Ciber SLasH' /> <title>JavaScript :: Пример работы "window.open()"</title> <script type='text/javascript'> /*** Открытие нового окна с изображением (если известен размер) *[ver 1]**/ function showImg_1(URL,imgPath, width,height) { var left = screen.availWidth/2 - width/2; var top = screen.availHeight/2 - height/2; // Если пишем методом "write" var imgHTML_1 = '<img width="'+width+'" height="'+height+'" src="'+imgPath+'" style="position: absolute; left: 0px; top: 0px">'; // Если пишем методом "add" var imgHTML_2 = '<img width="'+width+'" height="'+height+'" src="'+imgPath+'">'; var wnd = window.open(URL, 'newWnd', 'width='+width+',height='+height+',left='+left+',top='+top+',screenX='+left+',screenY='+top+',resizable');   if (URL != "")  // если пустой URL, тогда метод "add"     wnd.document.body.innerHTML += imgHTML_2;   else {  // иначе — "write"     wnd.document.write('<html><head><title>JavaScript :: "window.open()" [метод: write]</title></head><body>'+imgHTML_1+'</body></html>');     wnd.document.title = 'JavaScript :: "window.open()" [метод: write]';     wnd.document.close();   } } /*** Открытие нового окна с изображением (если размер не известен) *[ver 2]**/ function showImg_2(URL,imgPath) { // Если пишем методом "write" var content = '<html><head><title>JavaScript :: "window.open()" [dynamic content]</title>' +     '<script type="text/javascript">' +     'function selfResizer(obj) {' +     'var w = obj.width;' +     'var h = obj.height;' +     'var left = screen.availWidth/2 - w/2;' +     'var top = screen.availHeight/2 - h/2;' +     '  window.resizeTo(w, h);' +     '  window.moveTo(left, top);' +     '}' +     '<\/script>' + '</head><body>' + '<img onLoad="selfResizer(this)" style="position: absolute; left: 0px; top: 0px" src="'+imgPath+'">' + '</body></html>'; // Если пишем методом "add" var imgHTML = '<img src="'+imgPath+'">'; var wnd = window.open(URL, 'newWnd', 'width=50,height=50,left=0,top=0,screenX=0,screenY=0,resizable');   if (URL != "")  // если пустой URL, тогда метод "add"     wnd.document.body.innerHTML += imgHTML;   else {  // иначе — "write"     wnd.document.write(content);     wnd.document.title = 'JavaScript :: "window.open()" [dynamic content]';     wnd.document.close();   } } </script> </head> <body> <fieldset><legend> showImg (ver 1)</legend> <button onClick='showImg_1("", "logo.png", 492,120)' title="Без URL [метод: write]">Картинка №1</button> <button onClick='showImg_1("OpenWindow_addon.htm", "rodina.jpg", 167,240)' title="URL=OpenWindow_addon.htm [метод: add]">Картинка №2</button> </fieldset> <fieldset><legend>showImg (ver 2)</legend> <button onClick='showImg_2("", "blood.gif")' title="Без URL [метод: write]">Картинка №1</button> <button onClick='showImg_2("OpenWindow_addon.htm", "alisa.gif")' title="URL=OpenWindow_addon.htm [метод: add]">Картинка №2</button> </fieldset> <fieldset><legend>window.open() с полноценным окном</legend> <input type="button" onClick='window.open("clap.gif", "newWnd", "width=640,height=480,left=0,top=0,scrrenX=0,screenY=0,alwaysRaised,directories,location,menubar,resizable,scrollbars,status,toolbar").document.title = "JavaScript :: \"window.open()\" [метод: write]"' value="Картинка №1"> </fieldset> </body> </html>

проверьте как работает, а...
у меня почему-то в Лисе не работают обе кнопки с названиями "Картинка №2" (наверно глюк FireFox 1.5 RC1 или какое-нить расширение глючит). Там по идеи должна фотка грузиться.
Сорц файла OpenWindow_addon.htm — в первом посту.

Это сообщение отредактировал(а) Ciber SLasH - 14.11.2005, 05:03

Кто-нибудь знает, почему в FireFox не работают кнопки с названием "Картинка №2" (вызов "showImg_2()" [метод: add]) ?

Никак не могу понять почему не работает именно в FireFox, даже в консоли JavaScript ничего не пишется...

Работает, но предупреждает что картинка не найдена, окно открывает. Лиса 1.0.7

Цитата(Sardar @ 17.11.2005, 00:19)

Работает, но предупреждает что картинка не найдена, окно открывает. Лиса 1.0.7

У меня окно тоже открывает, но картинку не хочет запихивать в новое окно

ЗЫ: снёс FF1.5RC1 и поставил FF1.0.7

Прописал абсолютный путь к картинке, но ничего не получилось...
Пробовал запихивать картинку не через innerHTML, а так:

Код

var pict = wnd.document.createElement('IMG'); pict.src = imgPath; wnd.document.getElementById('pic').appendChild(pict);

соответственно добавил в файл OpenWindow_addon.htm

Код

<div id='pic' align="center"></div>

Тока всё это Лисе до одного места...

Картинка просто не появляеться или как? Т.к. обьект картинка должен существовать, но мозилла может кинут (и кинет) ошибку в виде alert'a если картинка не доступна. Указывать в таком случае лучше абсолютный путь.

У меня открываеться окно, в нём картинка с невалидным URL, поэтому отбражаеться в виде малого квадратика, как и должно.

Вопрос: зачем всё это, почему нельзя через document.write написать всю разметку, начиная и кончая <html>? Тогда ошибок не будет и с XHTML по идее конфликтовать не должно, ты ведь всё разом пишешь.

Цитата(Sardar @ 18.11.2005, 01:15)

Картинка просто не появляеться или как?

Да, именно не появляется.

Цитата(Sardar @ 18.11.2005, 01:15)

Т.к. обьект картинка должен существовать, но мозилла может кинут (и кинет) ошибку в виде alert'a если картинка не доступна. Указывать в таком случае лучше абсолютный путь.

Никаких алертов не вылазит. Путь указываю абсолютный.

Цитата(Sardar @ 18.11.2005, 01:15)

У меня открываеться окно, в нём картинка с невалидным URL, поэтому отбражаеться в виде малого квадратика

У меня этот квадратик мелькнёт, а дальше ичезает и всё.

Цитата(Sardar @ 18.11.2005, 01:15)

зачем всё это, почему нельзя через document.write написать всю разметку

Сейчас это просто тренировка в JS, но в дальнейшем может и понадобится.
В принципе конечно можно всё write-ом записать, просто я искал другие варианты...