FRNET.NAROD.RU » Статьи » Всплывающие окна
  » Навигация
- - - - - - - - - - - - - - - -
  » Наша кнопка
- - - - - - - - - - - - - - - -
   » Всплывающие окна
 
Автор: Алексей Голубев

Сайт: http://www.frnet.narod.ru/

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

function show_big_pic(url) {
window.open(url, "win" ,"toolbar=no, status=no, menubar=no, location=no, directories=no, resizable=no, height=505 width=660");
}
В данной функции используется метод open элемента window. Давайте разберем его параметры.

Параметр 1 – URL открываемого документа, у нас он указывается при непосредственном вызове функции.
Параметр 2 – имя окна, в котором будет открыт документ. Если окно с таким именем уже есть, то документ откроется именно в нем.
Параметр 3 – параметры нового окна:

toolbar – может принимать значения yes или no, определяет, будет ли у нового окна панель инструментов;
status – будет ли у окна строка состояния;
menubar – показывать строку меню или нет;
location – скрывает/отображает поле для ввода url;
directories – меню с ссылками;
resizable – задает возможность изменения размеров окна;
height и width – высота и ширина открываемого окна.

Помимо HTML-документов в окне можно загрузить также и картинку, и все, что может отобразить браузер.

Пример вызова данной функции:

1) добавить тег с атрибутом id, вот, как будет выглядеть данная строка в нашем примере:

<a href=”#” onClick=”show_big_pic(‘img1.jpg’)”>Открыть картинку в новом окне</a>
Можно данную функцию также сочетать с функцией щелчка правой кнопкой мыши, разобранной в статье: Обработка нажатия правой кнопкой мыши.

P.S. Пример работы скрипта можно скачать здесь.

 

  » Друзья сайта
- - - - - - - - - - - - - - - -
  » Разное
- - - - - - - - - - - - - - - -
  » Счетчики
- - - - - - - - - - - - - - - -
  Дизайнер и ведущий проекта: Голубев Алексей
Copyright Alexei Golubev © 2004
Hosted by uCoz