Всплывающее окно Javascript - обновлено - PullRequest
Новая
       0

Всплывающее окно Javascript - обновлено

0 голосов
/ 08 сентября 2011

Я скопировал этот код из "www.hotscripts.com", http://www.advancebydesign.com/itemdetails.php?item=15. Что он делает, он просто отображает простое окно в середине экрана.

Требуется 3 очень простых шага:

1) создать кнопку <input type="button" onclick='Javascript:my_box.Show();' value="Show Popup Box">

2) включить это в голову <script language="Javascript" type="text/Javascript" src="jscpopupbox.js"></script>

3), а также это добавлено в голову: 

my_box = new jscPopupBox();
my_box.width = 400;
my_box.height = 450;

content_html = "<div style=\"padding:0;height:30px;margin:0;border:none;";
content_html+= "background-color:#CCF;clear:both;\"><input type=\"button\" ";
content_html+= "style=\"float:right;height:26px;width:26px;\" value=\"X\" ";
content_html+= "onclick='my_box.Hide();'></div>\n";

content_html+= "<iframe src=\"../license.txt\" width=\"100%\" style=\"";
content_html+= "border:none;padding:0;margin:0;\" height=\"420px\"></iframe>";

my_box.html = content_html;

Чего я не понимаю, так это того, почему окна на моем сайте появляются в левом верхнем углу, а не в середине. Я не трогал исходный код, и когда я пробую его на простой HTML-странице, он, кажется, работает. Мой CSS мешает?

Я удалил весь CSS с моего сайта, и в конце концов обнаружил, что проблема не в этом, а в этом <!DOCTYPE HTML> в верхней части страницы. Какое это имеет отношение к разделу javascript? Разве это не часть объявления, которая сообщает браузеру, какую страницу он читает? Во всяком случае, когда я удаляю его, все работает нормально. (кстати, моя страница содержит HTML5-видео.)

Ответы [ 4 ]

0 голосов
/ 08 сентября 2011

Возможно, вы захотите попробовать более сложное определение типа документа. Вы найдете информацию от W3C здесь: http://www.w3.org/QA/2002/04/valid-dtd-list.html

Кроме того, некоторые из моих страниц xhtml используют заголовок определения xml в самом верху: начиная примерно так: 

    <?xml version="1.0" encoding="ISO-8859-1"?>
    <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN"
       "http://www.w3.org/TR/html4/frameset.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
0 голосов
/ 08 сентября 2011

Doctype сообщает браузеру, какую версию спецификации HTML использовать, вы можете получить разные результаты в разных браузерах с определенными типами документов.

Некоторые типы документов предполагают, что все теги закрыты, не работают / не работают с самозакрывающимися тегами и т. Д.

Как правило, это повлияет только на ваш HTML, но если ваш JS создает HTML, это может быть затронуто косвенно.

0 голосов
/ 08 сентября 2011

Это слишком много для создания всплывающего окна, которое отображается или скрывается.

Обычно просто включите DIV, который вы хотите отобразить с классом CSS по умолчанию, как display:none, затем либо добавьте новый класс с display:block, либо более аккуратно используйте Jquery для переключения классов.

0 голосов
/ 08 сентября 2011

попробуйте изменить 

content_html = "<div style=\"padding:0;height:30px;margin:0;border:none;";

на 

content_html = "<div style=\"padding:0;height:30px;margin:auto;border:none;";
...