| Главная » Статьи » Мои статьи |
jQuery Windows Engine Plugin
jQuery Windows Engine Plugin позволяет с легкостью создавать ajax окошки.
Для того, чтобы создать новое окно, используйте команду:
$.newWindow();Эти окна можно полностью настраивать: сворачивание окна, разворачивание окна, изменение размеров окна, возможность передвигать окно и др. Так же имеется возможность настройки стиля окна через css. Команды и параметры: $.newWindow({
id: "",
title: "",
width: 200,
height: 200,
posx: 50,
posy: 50,
content: "",
onDragBegin : null,
onDragEnd : null,
onResizeBegin : null,
onResizeEnd : null,
onAjaxContentLoaded : null,
statusBar: true,
minimizeButton: true,
maximizeButton: true,
closeButton: true,
draggable: true,
resizeable: true
});Описание параметров создания окна id: "" - Идентификатор окна, указывается как например: id:"okno1"
указывается в двойных скобках.title: "" - Заголовок окна, указывается в двойных скобках, например: title:"Заголовок окна"
width: 200 - Ширина окна в пикселях, например:
width:680
height: 200 - Высота окна в пикселях, например:
height:400
posx: 50 - Позиция окна по оси X, например:
posx:600
posy: 50 - Позиция окна по оси Y, например:
posy:200
content: "" - Содержимое окна, в двойных кавычках, например:
content:"
onDragBegin : null - При начале перемещения окна: событиеonDragEnd : null - Когда перемещение окна закончено: событие onResizeBegin : null - При начале изменения размеров окна: событие onResizeEnd : null - При завершении изменения размеров окна: событие onAjaxContentLoaded : null - При завершении AJAX подгрузки содержимого окна: событие statusBar: true - Статус-бар: (true/false) minimizeButton: true - Кнопка "Свернуть окно": (true/false) maximizeButton: true - Кнопка "Развернуть окно": (true/false) closeButton: true - Кнопка "Закрыть окно": (true/false) draggable: true - Можно ли перемещать окно: (true/false) resizeable: true - Можно ли изменять размер окна: (true/false) Так же команды: Обновить содержимое окна, здесь в качестве параметров - id окна, новый контент $.updateWindowContent(id,newContent);
Пример:
$.updateWindowContent("okno1",'Google');
Внимание! В html-тегах, в атрибутах значения пишутся не в двойных кавычках, а как например: target=\'_blank\' Так как двойные кавычки существуют для указания например названия идентификатора в параметрах при создании окна. Если вы поставите двойные кавычки, код может не работать. У меня написаны двойные, но это из-за команды подсветки синтаксиса на сайте, будьте внимательны!Обновить содержимое окна с помощью AJAX, параметры - id окна, url страницы. $.updateWindowContentWithAjax(id,url);
Переместить окно в координаты, параметры - id окна, позиция по x, позиция по y
$.moveWindow(id, x, y);
Моя любимая команда, с ней возился дольше всего, мне нужно было создать отдельный файл, вызывая который, можно было бы управлять окном, то есть сворачивать, разворачивать, закрывать, и, перемещать если заедет под панель инструментов например, оказалось там есть одна тонкость, описания которой я так и не нагуглил.Пример: $.moveWindow("ajaxwindow", 200, 200);
или
$.moveWindow('ajaxwindow', 200, 200);
Если же вы тоже захотели вызывать функцию через файл, передав в качестве параметра id окна, то эта команда будет выглядеть следующим образом:
$.moveWindow(id.substr(1), 200, 200);
Потому что в качестве параметра передается: #ajaxwindow, а скрипт не хочет считывать id, если в ней есть знак #. Такая же ситуация и для функции изменения размера окна.Изменить размер окна, параметры - id окна, ширина(px), высота(px) $.resizeWindow(id, width, height);
Пример:
$.resizeWindow('ajaxwindow', 200, 200);
Пример для вызова через id:
$.resizeWindow(id.substr(1), 200, 300);
Свернуть окно, параметр - id окна
$.minimizeWindow(id);
Пример:
$.minimizeWindow('ajaxwindow');
Развернуть окно, параметр - id окна
$.maximizeWindow(id);
Пример:
$.maximizeWindow('ajaxwindow');
Закрыть окно, параметр - id окна
$.closeWindow(id);
Пример:
$.closeWindow('okno1');
Закрыть все открытые окна
$.closeAllWindows();
Автор: SKV1991 Частичное или полное копирование материала только с активной ссылкой на мой сайт и указанием автора, т.е. меня. Часть материала использована с официального сайта проекта. Официальный сайт проекта: http://hernan.amiune.com/
| |
| Просмотров: 1469 | Теги: | Рейтинг: 5.0/2 |
В центр экрана
Свернуть
Восстановить
Закрыть окно| Всего комментариев: 0 | |
