Разное

Поиск в сети показал, что многие понимают, что такое "Модальное окно", как бы чувствуют фибрами души, но не могут выразить словами.

Вот и я тоже не могу.

А есть ли определение этого термина? Можно ли взглянуть на пример?

дополнительное окно открываемое внутри программы.

в вебе - alert()
или новый слой http://www.master-web.info/wp-content/uploads/2009/02/layout_overrides_login_popup.png

Спасибо! Замечательный пример!

Модальное окно - это очень просто, это окно программы которое не позволяет работать с другими элементами программы, пока вы не закроете это окно. Когда выключаете компьютер - окно модальное, оно не даст вам ничего сделать, пока вы не определитесь с выбором - выключить или отмена.

Как можно предположить, содержимое модальных окон на сайте не индексируется поисковиками. Так?

зависит от способа получения информации.
окно может быть сразу в верстке страницы, может быть в js-файле или загружаться в iframe/ajax

окно может быть сразу в верстке страницы, может быть в js-файле или загружаться в iframe/ajax

Вроде бы, в верстке иметь всегда предпочтительнее (для индексации). А если это так, то почему находит применение iframe/ajax ?

У вас могут быть тысячи сообщений (служебных предупреждений, реклама, еще что-то), собственно к странице не относящиеся, передавать их каждый раз в скрытом состоянии, не зная потребуются они или нет, не очень разумно, лучше их через AJAX вызывать.

А если такая ситуация.

В меню список конфет. На название кликаешь и всплывает её рецептура у разных производителей (в виде таблицы). Эту таблицу пользователь может прямо в окне отсортировать с условием (например, оставив только те, где кофеина не больше 3 %). А по клику на выбранную в полученном списке, получает новое всплывающее окно, в котором подробные сведения о производителе.

Как это лучше осуществить (предполагается использование какой-нибудь типовой ЦМС)?

Мне кажется, что в этом случае, разумно всю эту информацию хранить в скрытом виде на странице и отображать при помощи JS, чтобы поисковые системы могли её сразу индексировать. И роботам, и пользователям будет удобно, а самое главное, скорее всего список не очень велик и страница будет не очень велика. Ну если, конечно, вам не кажется, что информация о производителе разбавит текст и снизит ценность страницы для поисковых систем.

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

Ну в зависимости от того, как они реализованы, можно сделать так, что будут индексироваться... вообще термин модальный заимствован из десктопного программирования (где есть два четких метода открытия окон: с доступностью родительского окна и элементов управления и без оного). Поэтому вы и не нашли сразу четкого определения для Web - здесь это не было принято, хотя концепция удачная и была быстро взята на вооружение Web-разработчиками. Изначально модальное окно - это окно со свойствами, которые описаны в моем посте выше. Web-разработчики адаптировали/заимствовали термин для своих нужд, поэтому в Web термин используется для обозначения разных классов окон и квазиокон - какие-то индексируются, какие-то нет, зависит от реализации. Это в GUI можно четко сказать - это окно модальное, а это нет, а в Web модальными являются те элементы, которые называют модальными и так как людей много, то четкого согласия по поводу этого вопроса нет. Если бы я был фанатиком, я бы сейчас принялся бы с пеной у рта доказывать, что alert() - это модальное окно, а реализация через <div> - нет... Другой бы мог начать доказывать обратно, что alert() - это модальное окно GUI Windows, а Web-модальное окно должно быть реализовано через <div>... но по большому счету разницы никакой нет - термин удобный и известен подавляющему большинству программистов - все друг друга понимают.

А не могли бы Вы показать код простейшего примера модального окна? Например, через alert() - как это выглядит?

Сохраните следующий код в файл с расширением html и запустите его.

<a href="http://softtime.ru">ссылка</a> <script>   alert("Попробуйте нажать на ссылку,\r\n пока это окно не закрыто!"); </script>

Замечательный пример, спасибо!

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

А ещё лучше бы при этом в тексте, воспроизводимом в модальном окне, иметь ссылку на softtime. Например, со слова "нажать".

Да, можно при нажатии на ссылку, но вот размещать HTML-элементы в окне alert() уже не получится (по крайней мере в большинстве браузеров) - только обычный текст, чтобы размещать HTML-ссылки, нужно реализовать DIV-блок.

А как сделать, чтобы модальное окно появлялось при нажатии на ссылку (пусть даже в окне только текст)?

Можно начать отталкиваться от следующего скрипта

<html> <head>   <title>Модальное окно</title>   <script type="text/javascript">     window.onload = function() {       document.getElementById('id_lnk').onclick = function() {         alert("Караул! Нажимают!");       }     }   </script> </head> <body>   <a id='id_lnk' href="#">нажми меня</a>  </body> </html>

Размер окна определяется автоматически исходя из длины текста?

А такие атрибуты, как желтый треугольник и надпись "Сообщение с ВЭБстраницы" формируются автоматически? При иных способах создания модального окна, нежели alert (iframe или ajax), их может и не быть, верно?

>Размер окна определяется автоматически исходя из длины текста?
Да.

>А такие атрибуты, как желтый треугольник и надпись "Сообщение с ВЭБстраницы" формируются >автоматически?
Да, более того, в разных браузерах они оформлены по-разному.

>При иных способах создания модального окна, нежели alert (iframe или ajax), их может и не быть,
>верно?
Совершенно верно, более того, в этом случае дизайн окна стараются согласовать с дизайном сайта.