Cuma , 21 Temmuz 2017
Anasayfa » JavaScript » JavaScript: Popup Pencere

JavaScript: Popup Pencere

Popup Pencele kullanıcıya ek bir belgeyi göstermek için kullanılan en eski yöntemlerden biridir.

En basit kullanım şekli:

Sayfa yeni bir pencerede açılacaktır. Ancak modern tarayıcılarda yeni pencerede açmak yerine yeni sekmede açılması daha hoş olacaktır.

Popuplar AJAX yöntemi yokken çok kullanışlı bir araçtı. Artık verileri arkaplanda istediğimiz tüm etiketlere yüklemek mümkün olmaktadır.

Popuplar ile ilgili en sinir bozucu kısımda bazen bir siteye girdiğinizde otomatik yeni reklam pencereleri açmasıdır. Bu tip kötü kullanımlar için artık tarayıcılar genellikle açılmak istenen popup penceresinin gizlendiği uyarısını vermektedir.

Ancak bu probleme rağmen bir popup penceresi yine de bir sitede işlevsel bir şekilde kullanılabilir.

Online hizmet veren bir sitede danışmandan canlı destek almak için kullanılabilir. Bu şekilde sitenin genel işleyişine ve görünüşüne karışmadan sohbet çalıştırılmış olur. Bu şekilde sitelere eklemek hem daha kolay olacaktır.

Yazım Kural:

window.open(adres,isim,parametreler)

  • isim:açılacak olan yeni pencere için bir isim. pencere tekrar kullanılacaksa isim vermek önemli
  • adres:açılmak istenen yeni pencere
  • parametreler:yeni pencerenin ayarları girilir. virgüllerle ayrılır (boşluk yok). Pencere ile ilgili tüm ayarlar aşağıdadır.
    • left: (Sayı) soldan ne kadar boşlukta açılacağı
    •  top: (Sayi) üstten ne kadar boşlukta açılacağı
    • width(Sayı):pencere genişliği
    • height (Sayı):pencere yüksekliği
    • menubar (yes/no):tarayıcı menü çubuğu olacak mı.
    • toolbar (yes/no):tarayıcı ileri geri tolbar olacak mı
    • location (yes/no):url adresi gizlensin mi(tarayıcılar güvenlik nedeniyle destek vermiyor)
    • resizable (yes/no):pencere boyutu değiştirilebilir olsun mu

Daha fazla özellik için:https://developer.mozilla.org/en-US/docs/Web/API/Window/open

 

 

 

Yeni Pencere Açıp Düzenleme:

Yeni pencere açıp, penceredeki etiketleri ve ayarları düzenleyebiliriz. yeni pencereye verilen isim üzerinden açıp her türlü düzenleme yapmak mümkündür. Aşığıdaki iki örnekte de değişken ismi olarak pencere ismi kullanılmıştır.

test.html :Örnek olarak test.html adında bir sayfayı açmak istiyoruz. test.html sayfasının içeriği aşağıdaki gibi olsun.

 

JS KODLARI:window.open komutunu çalıştıracağımız sayfadaki javascript kodlarımızda şu şekilde olsun

Örnek 2: Her tıklamada aynı popup penceresine bir satır ekleyen kod

 

YENİ SEKMEDE AÇMA: JavaScript ile Sayfayı Yeni Sekmede Açma:  window.open metoduna ‘_blank’ parametresini geçmek gerekiyor.

 

Faydalanılan Kaynaklar:

http://stackoverflow.com/questions/19851782/how-to-open-a-url-in-a-new-tab-using-javascript-or-jquery

http://javascript.info/tutorial/popup-windows#the-syntax-of-window-open

https://developer.mozilla.org/en-US/docs/Web/API/Window/open

http://www.javascript-coder.com/window-popup/javascript-window-open.phtml

 

Hakkında Hayri

İlginizi Çekebilir

JQuery Checked Kullanımı

Bu örneğimizde JQuery ile checkbox kullanarak resim gizleyip göstermeyi yapacağız. Bunun için ilk olarak JQuery’nin sitesinden …

Bir Cevap Yazın

E-posta hesabınız yayımlanmayacak. Gerekli alanlar * ile işaretlenmişlerdir