SimpleModal – маленький плагин для создания модальных окон

Главная

Статьи

Веб-программирование

26.11.2011 00:00

SimpleModal – маленький плагин для создания модальных окон

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

Примеры использования:

Alert:

$("myElement").addEvent("click", function(){

 var SM = new SimpleModal({"btn_ok":"Alert button"});

 SM.show({

 "title":"Заголовок окна",

 "contents":"Ваше сообщение..."

 });

});

Modal integration

 $("myElement").addEvent("click", function(){

 var SM = new SimpleModal({"btn_ok":"Confirm button"});

 SM.addButton("Action button", "btn primary", function(){

 alert("Add your code");

 this.hide();

 });

 SM.addButton("Cancel", "btn");

 SM.show({

 "model":"modal",

 "title":"Заголовок",

 "contents":"Ваше сообщение..."

 });

});

Modal-ajax integration

 $("myElement").addEvent("click", function(){

 var SM = new SimpleModal({"width":600});

 SM.addButton("Action button", "btn primary", function(){

 this.hide();

 });

 SM.addButton("Cancel", "btn");

 SM.show({

 "model":"modal-ajax",

 "title":"Заголовок",

 "param":{

 "url":"ajax-content.php",

 "onRequestComplete": function(){ /* Action on request complete */ }

 }

 });

});

Modal-image

 $("myElement").addEvent("click", function(){

 var SM = new SimpleModal();

 SM.show({

 "model":"modal-ajax",

 "title":"Image title",

 "param":{

 "url":"http://url-file.jpg",

 "onRequestComplete": function(){ }

 }

 });

});