JavaScript açılır(popup) pencere,yeni sekme kodu kullanımı örneği (JavaScript popup window,new tab code usage example)

JavaScript ile açılır pencere(popup window) yada yeni sekmede açmak istediğinizde

window.open()

kodundan yararlanabilirsiniz.

Parametreler ile yeni açacağınız pencere veya sekmeye özellikler katabilirsiniz.

window.open(URL(ops.), hedef(ops.), özellik(ops.), değiştir(ops.));

(ops. – opsiyonel olarak isteğe bağlı gerektiğinde değer verebilir yada vermeyebilirsiniz)

1. parametreye yönlendireceğiniz adresi yazabilirsiniz, hiç parametre vermez yada boş bırakırsanız açılacak olan pencere,sekme içeriği boş olacaktır.
2. parametreye yönlendireceğiniz pencereye kendinizce kod içerisinde ad verebilirsiniz yada aşağıdaki parametreler ile farklı işlemler yapabilirsiniz. .open() fonksiyonuna 2. parametreyi göndermez iseniz varsayılan olarak “_blank” özelliği ile işlem görülecektir.

"_blank"
"_self"
"_parent"
"_top"
yada 
"pencereminAdi" yönlendireceğiniz pencerenin kendini kodunuz içerisinde adını verebilirsiniz.

“_blank”: yeni sekmede bağlantıyı açar.
“_self”: mevcut bulunulan içeriğin yerine yönlendirilen adresi açar.
“_parent”: mevcut bulunulan sayfanın bağlı bulunduğu bir üst çerçeve,bölüm mevcut ise bağlantıyı orda açacaktır yok ise bulunulan sayfanın yerinde açılır.
“_top”: mevcut bulunulan sayfanın en üst bağlı bulunduğu çerçeve,bölüm de açar zaten en üst kısımda iseniz mevcut bulunulan sayfanın yerinde işlem gerçekleşir.

Eğer ad verirseniz hedef özelliği otomatik “_blank” özelliği kazanacak.
Eğer 2.parametreye “_blank” özelliği kazandırıp 3.parametreye ise “width” veya “height” özelliği değerleri verir iseniz yönlendirme sayfanız bu boyutlardaki yeni bir pencerede açılır.Bu özellikleri vermez iseniz tarayıcınızın özellikleriyler eş özelliklere sahip olarak yeni sekmede açılır.
3. parametreye ise yönlendirme yapacağınız adresin bulunacağı yeni sekme yada pencerenin özelliklerini yazabilirsiniz. bu özellikler aşağıdaki gibidir.

channelmode
directories
fullscreen
height
left
location
menubar
resizable
scrollbars
status
titlebar
toolbar
top
width

4. parametreye ise yönlendirme yapacağınız adresin tarayıcı geçmişindeki durumunu ifade edecek

true
false

değerlerini girebilirsiniz

Javascript örnek kodumuzda iki farklı JavaScript fonksiyonu çağırma şeklinden yararlanılarak farklı fonksiyon çağırma şekilleride gösterilmiştir.
Aşağıdaki javascript popup window örnek kod bloğunu bir metin dosyasının içine yapıştırın ve dosyanın uzantısını .html olarak değiştirdikten sonra bu .html dosyasını açıp kod örneğimizin canlı çalışma şeklini görebilirsiniz.

<!DOCTYPE html>
<html>
<head>
	<title> popup window, new tab | açılır pencere, yeni sekme | yazilimcity.net </title>
	<meta charset="UTF-8">

	<script type="text/javascript">
		function openNewWindow(){
			window.open("http://www.yazilimcity.net", "yazilimcity.net", "width=250, height=300");
		}

		openSiteNewTab = function() {
			window.open("http://www.yazilimcity.net");
		}

		openBlankNewTab = function() {
			window.open();
		}
	</script>

</head>
<body>

	<a href="javascript:openNewWindow()">yeni pencere aç</a>
	<br>
	<input type="button" onclick="openBlankNewTab()" value="boş yeni sekme aç" />
	<br>
	<input type="button" onclick="openSiteNewTab()" value="yeni sekmede site aç" />

	<footer>
		<b>
			<address>
				<a href="http://www.yazilimcity.net">www.yazilimcity.net</a>
			</address>
		</b>
	</footer>
</body>
</html>
Share on Facebook0Tweet about this on TwitterShare on Google+0Share on StumbleUpon0Share on Reddit0

Leave a Reply


*