window.open
window.open() metodu yeni pencere açmak için kullanacağımız metoddur. Bu metodun bir çok parametresi var. Önce bir pencerenin nasıl açıldığını görelim ve sonrada bu parametreleri tanıyalım.
window.open("yenipencere.html"); yeni bir pencere açar ve içinde yenipencere.html adlı web sayfasını görüntüler. Bunu bir fonksiyon olarak tanımlayabilir ve fonksiyonu çağırtarak yeni pencere açtırabiliriz. Yada bir buton tanımlar ve buton üzerinden direkt olarakta pencereyi açtırabiliriz.
<form>
<input type="button" value="yeni pencere aç"
onClick="window.open('yenipencere.html')">
</form>
Burada şu şekilde düşünebilirsiniz; zatan ben html tagları ile yeni bir pencere açabiliyorum Bu şekilde bir kullanıma ne gerek var? Evet bir bakıma doğru fakat javaScript ile yeni açılacak pencerenin bütün özellikleri üzerinde oynayabilir ve yeni açılan pencereye direkt olarak ana penceremizden komutlar gönderebiliriz.
Yeni pencere açarken kullanacağımız parametreleri görelim. Bunlar window nesnesinin kullanılabilen özellikleridir.
Parametre |
Açıklama |
Değer |
width |
Pencerenin genişliği |
Pixel olarak |
height |
Pencerenin yüksekliği |
Pixel olarak |
toolbar |
Toolbar çubuğunun gösterilmesi |
yes/no |
menubar |
Menü çubuğunun gösterilmesi |
yes/no |
scrollbars |
Kaydırma çubuklarının gösterilmesi |
yes/no |
location |
Url çubuğunun gösterilmesi |
yes/no |
status |
Sttus çubuğunun gösterilmesi |
yes/no |
directories |
İkinci araç çubuğunun gösterilmesi |
yes/no |
resizable |
Pencerenin büyütülüp küçültülmesi |
yes/no |
top |
Üst kenara uzaklık |
pixel olarak |
left |
Sol kenara uzaklık |
pixel olarak |
JavaScriptin 1.2 versiyonu ile daha yeni parametreler de eklendi. Bu paramereleri(alwaysLowered, screenX, screenY, outerWidth gibi) şu anda incelemeyeceğiz.
Öğrendiğimiz parametreleri uygulayarak bir pencere açmayı görelim.
<html> <head> <title>JavaScript nesneleri</title> <script language="JavaScript"> <!-- gizle function pencereAc() { window.open("deneme.html","yenisayfa", "width=200, top=0, left=500, height=300, status=yes, menubar=yes, resizable=yes"); } // gizleme sonu --> </script> </head> <body> <form> <input type="button" value="pencere ac" onClick="pencereAc()"> </form> </body> </html>
Açacağımız pencere için şu özellikleri belirledik, deneme.html yi gösterecek, yenisayfa adında, 200 pixel genişliğinde, 300 pixel yüksekliğinde, üstarafa yapışık, sol kenara 500 pixel uzaklıkta, menubar açık, status açık ve pencere büyütülüp küçültülebilir.
Ayrıca şunu belirteyim yes/no şeklinde belirlenen parametreler 1=açık, 0=kapalı şeklinde de gösterilebirler.
Pencerelere komut yollamak Açtığımız pencereye komutlar yollayabiliriz. Bu javaScriptin etkileşimliğinden ileri gelir. Bunun için öncelikle pencereyi bir nesne olarak tanımlayıp ona bir ad vereceğiz.
yeniPencere=window.open("","yeni","width=300, height=500");
Sonra pencereye bir html belgesi gireceğiz. Yani document. Bunu bir sayfa adresi vererek değil bunun yerine ana sayfamızdan gönderme yaparak yapacağız.
Bunun için önce yeni bir document nesnesi yeniPencere nesnesine açtıralım. open() metodunu kullanacağız.
yeniPencere.document.open();
yeniPencere ye bir html belgesi başlangıcı olduğunu belirtikten sonra bu sayfayı girelim.
yeniPencere.document.write("<html>"); yeniPencere.document.write("<head>"); yeniPencere.document.write("<title>yeni pencere</title>"); yeniPencere.document.write("</head>"); yeniPencere.document.write("<body>"); yeniPencere.document.write("<font size=4 color=green>"); yeniPencere.document.write("Pencereye yeni bir sayfa açtırdık."); yeniPencere.document.write("</font>"); yeniPencere.document.write("</body>"); document.write("</html>");
yeniPencere. Açtığımız document ten çıkalım.
yeniPencere.document.close();
|