Bu makalemizde javascript’de en sık kullanılan window.open ile popup açtırmayı bir fonksiyon haline getirip daha kullanışlı bir hale getirelim.
İçerik
göster
Javascript window.open için popupWindow adında bir fonsksiyon hazırlama
Normalde window.open() metoduyla default olarak genişlik – yükseklik gibi değerleri girmemiz gerekiyor ve sürekli width, height v.b. opsiyonlarını sürekli yazmamız gerekmektedir ama bu fonksiyon ile opsiyon adlarına sadece değerlerini girerek window.open() metodunu fonksiyon içerisinde kolayca doldurabilmekteyiz.
window.Open() metodu için popupWindow metodunumuz;
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 | function popWindow(href, winname, width, height, toolbar, scrollbars, resizable, status) { if (href == "") href = '/contact.aspx'; if ((width < 100) || (width == null)) var width = '515'; if ((height < 100) || (height == null)) var height = '475'; if (toolbar == null) var toolbar = 'yes'; if (scrollbars == null) var scrollbars = 'yes'; if (resizable == null) var resizable = 'yes'; if (status == null) var status = 'yes'; var theParam = "width=" + width + ",height=" + height + ",toolbar=" + toolbar + ",scrollbars=" + scrollbars + ",resizable=" + resizable + ",status=" + status + ",screenX=1,screenY=1,top=1,left=1"; var thePopup = window.open(href, winname, theParam); thePopup.focus(); } |
Bu metodu kullanırken isterseniz ilk parametrede istenen url adresini girip diğerlerini boş geçerseniz fonksiyon içerisinde otomatik set edilmektedir değerler. eğer href adlı ilk parametrede boş geçilirse ‘contact.aspx’ adlı iletişim sayfasına yönlendirilecektir.
Örnek kullanımlar
1 2 3 4 5 6 7 8 9 10 11 | //Eğer bu şekilde boş geçilirse contact.aspx sayfasına //yönlendirilecek <input onclick="popWindow()" type="button" value="Test" /> //Kendi sayfama sadece ilk parametreye site adresimi //girerek popup açabiliyorum <input onclick="popWindow('http://www.muratoner.net/')" type="button" value="Test" /> //Tüm parametreleri kullanma <input onclick="popWindow('http://www.muratoner.net/','Murat ÖNER','640', '480','no','yes','no','yes')" type="button" value="Test" /> |
