JAVA SCRİPT

	Sign In Sign-Up

Aşağıdaki satırları HTML sayfanızın ilgili yerlerine girdikten sonra başka bir URL'ye atlayın ve geri dönün, sonuç sizi oldukça şaşırtacaktır. İfadeyi nasıl özelleştireceğinizi aşağıda bulacaksınız. <META HTTP-EQUIV="Site-Enter" content="revealTrans(Duration=1.0,Transition=23)"> <META HTTP-EQUIV="Site-Exit" content="revealTrans(Duration=1.0,Transition=23)"> Bir çoğunuzun görüp de bu da ne dediğiniz HTTP-EQUIV ifadesinin açılımı şöyle "Hypertext Transfer Protocol Equivilant". Basit olarak bu ifade HTTP protokolünü kullanan HTML sayfasının nasıl görüntüleneceğinini tanımını yapar. "Site-Enter" kelimesi sayfanıza girildiğinde neler olacağını, "revealTrans" ifadesi ise daha önceki sayfanın belirlenen methodla "kaybedileceğini" söylüyor. META tag'ı içerisinde kullanılan Duration=1.0 ifadesi geçişi gerçekleştirilen her bir bloğun 1saniye içerisinde işleneceğini, Transition=23 ifadesi ise diğer 22 geçişten bir tanesinin rasgele olarak seçileceğini belirtiyor. Geçiş Numaraları: Aşağıdaki numaraları siz de örneğimizdeki yerine koyarak nasıl geçişler gerçekleştiğini gözlemleyebilirsiniz. Örneğimizdeki 23 numarasını kullandığınızda ise aşağıdaki numaralardan rasgele bir tanesi seçilecektir. # Geçişler 1) İçten dışa geçiş 2) Dıştan içe geçiş 3) Ortadan dışa doğru geçiş 4) Alttan üste geçiş 5) Üstten alta geçiş 6) Soldan sağa geçiş 7) Sağdan sola geçiş 8) Soldan sağa dikey çözülme 9) Üstten aşağı yatay çözülme 10) 8 ve 9'un birleşimi 11) 8'e oldukça benziyor 12) Piksel piksel çözülme 13) Dıştan içe dönerek geçiş 14) İçten dışa dönerek geçiş 15) Üstten ve alttan geçiş 16) Ortadan üste ve alta kapanma 17) Sağdan sola çapraz geçiş 18) Diğer açıdan sağdan sola çapraz geçiş 19) 17'nin aynısı, aksi yönüne 20) 18'in aynısı, aksi yönüne 21) Rasgele yatay çizgiler 22) Rasgele dikey çizgiler

WEB SAYFASINI EN ÜSTTE TUTMAK

Web sitenizde kolay gezinme sağlamak için bir pencere içerisinde navigasyon menüsü hazırladınız.Fakat bu menü hep arka planda kalarak işlevini yerine getiremiyor. Sizin istediğiniz ise bu menünün her zaman üstte kalması ve kullanıcının kolayca ona erişmesi.

Bir Web sayfasını her zaman üstte tutmak çok kolaydır, tek yapmanız gereken onBlur="self.focus()" ifadesini BODY tag'ının içine yerleştirmektir. Bu ifadenin kullanılmasını aşağıdaki örneğimizde bulacaksınız. Öncelikle navigasyon sayfamızı ateşleyecek bir sayfa oluşturalım:

<HTML> <BODY> <SCRIPT LANGUAGE="JavaScript">  </SCRIPT> <FORM> <INPUT TYPE="BUTTON" VALUE="Pop-Up" onClick="topWindow()"> </FORM> </HTML> Şimdi ise gezinme menüsünü oluşturan kodları hazırlayalım: <HTML> <BODY onBlur="self.focus()" bgcolor=ffffff> Burada gezinme için gerekli olan kodlar bulunacak...

ALTI ÇİZGİSİZ VE ÜZERİNE GELİNDİĞİNDE RENK DEĞİŞTİREN LİNKLER

Bu tekniği benim sayfamda da görebilirsiniz. Üzerine glindiğinde hem rengi hem de mouse simgesi değişen bu script oldukça güzeldir. Doğrusu sayfanızda kullanmanıı tavsiye ederim. İsterseniz "cursor" yazan yeri iptal ederek linklerin üzerine gelindiğinde yine mouse kursorünü kullanabilirsiniz. Artık buradaki renkleri değiştirmek de size kalmış. Bunları meta takısından önce yazınız.

FLOATİNG FLAME

Bu kısa aklenti sayesinde sayfalarınızın içerisinde başka bir sayfa varmış gibi görünebilir.Yani yeni bir frame.İstediğiniz herhangibir html dosyasını sayfanızın istediğiniz herhangibir yerinde istediğniz byoutlarda yerleştirebilir ve hareket ettirebilirsiniz.

Deneme.htm yerine istediğiniz her türlü adresi yazabilirsiniz.

SAYFA İÇERİSİNDE BAŞKA BİR SAYFA DAHA

Bazı web sayfalarında görünen bi şey vardır.Yazılar yukarıdan-aşağı,sağa,sola vb. yönlere kayarak geçmektedir.Tabii bunların çoğunluğu Java ile yapılmış olan scriptler olduğundan açılmaları biraz uzun sürer.Oysa şu altta görmüş olduğunuz teknik sayesinde bu çok basit ve sayfalarda açılması çok daha kolaydır.

SAYFA NE ZAMAN DEĞİŞTİRİLMİŞ?

Bilinen bi şey vardırki bi site daima aynı şekilde kaldımı hiçbir cazibesi yoktur.Fakat her ne kısa zaman içerisinde yenilenirse o kadar ilgi görür.İşte bu nedenle bazı kullanıcıların ilgisini daha çok çekebilmek için sayfanızın en son ne zaman güncellendiğini belirten Java Script kodunu sayfanıza koyabilirsiniz.

ARAMA MOTORLARINA YARDIMCI OLUN

Her şeyinizi ortaya koydunuz mtühiş bir site hazırladınız ve şimdi bunu duyurmak istiyorsunuz.Fakat kimse sitenizin adresini bulamayınca arama motorlarına saldırıyor.Bakıyorlar arama motorlarıda bulamadı pas geçiyorlar ve onca emeğiniz boşa gidiyor.Bunun için ne yapmak gerek tabii ki biraz yardım.Kime??? Arama motorlarına.Altta görmüş olduğunuz paragrafları sayfanıza ekelyin.

RASTGELE İŞLEMLER

Yine Java Script ile yapılmış olan bu script te ise yazdığınız herhangibir söz,vecize vb. şeyler rastgele bir şekilde ekranda görüntülenmektedir.Eğer biraz programcılığınız varsa zaten bu scripte daha fazla yazı eklemek için "Array(3)" - "ar[sec%4])" yükseltilmesi gerektiğini ve yeni vecizenin de "ar[x]=" şeklinde yazılması gerektiğini anlarsınız

WEB SAYFALARINDA FORM KULLANIMI

Web sayfalarında ne çok karşılaşılan ve tasarımcıları birçok zorluktan kurtatran diğer bir teknik ise FORMlardır.Bunların içierisinde istediğiniz kadar soruyu sorabilir (evet-hayır) cevap şekli atayabilir,tick işlevliği sağlayabilir ve isterseniz bie metin bile yazdırabilirsiniz.Bunun için bilmeniz gerekenler.

Form Tag--> Genel kullanım: <form action=URL method=get-post target=pencere> Action=URL -->Formun göndeerildiğinde hangi program tarafafından değerlendiriliceğini bildirir. Method=get-post -->Bilgilaerin sunucuya hangi yolla gönderileceğini belirler. GET->Kontrollere girilen içerik o anda bulunulan adrese eklenip değerlendiriciye gönderirlir. POST->Form içeriğini direkt olarak derleyiciye gönderir. Target=window -->Netscpae tarafından getirilen bu tag form değerlendirici tarafından kullanıcıya geri yanıtın hangi pencerede belireceğinin gösterir. Input Tag --> Genel kullanım: <input align=tip [checked] maxlength=uzunluk name=isim size=boyut Src=adres Type=tip Lue=değer> Align=tip --> Type değeri bir resim olarak atandığında bir sonraki resme göre nasıl terleştirileceğini ayarlar. TOP,MIDDLE yada BOTTOM değerleri kullanılır. Checked -->Kontrol olarak bir işaretleme veya seçim kutusu kullanıldığında bunun karşımıza işaretlenmiş olarak gelmesini sağlar. Maxlength=uzunluk -->Metin kutusuna kullanıcını max. kaç karakter girebileceğini belirler. Name=isim -->Kontrole bir isim verir. Size=boyut -->Kontrolün boyutlarını karakter cinsinden belirlemenizi sağlar. TEXTAREA kontrolu kullanıldığında "en-boy" gibi bir ifade kullanılarak kontrolün boyutları en-boy cinsinden ayarlanabilir. Src=adres -->Kontrol olarak resim seçildiğinde resmin bulunduğu adresi taşır. Type=tip -->Kontrolün cinsini belirler ve şu değerlerden birini alabilir. Checkbox->Bir işaretleme kutusu görüntüler ve sadece doğru veya yanlış değerlerini alabilir. Hidden-> Web tarayıcısının pencerisinde görünmez fakat içerdiği değer gönderilen form ile web sunucusuna ulaşır. Image-> Bir resmi ifade eder ve üzerine tıklandığında form değerlerini sunucuya yollar. Text-> Text kontrolü ile aynı özellikleri taşır fakat kullanıcını girdiği karakterler bu kontrolde yıldız şeklinde görünür. Radio-> Kullanıcının bir çok seçenek içerisinden bir tanesini seçebilmesine olanak atnır.Grup içerisinde Radio kontrolleri her zaman aynı ismi taşımlaı fakat value değeri farklı atanmalıdır. Reset-> Tıklandığında formun içeriğini temizler Submit-> Formun içeriğini sunucuya yollar. Text-> Kullanıcının tek satırlık veri alınmasına olanak tanır. İşte yukarıda verilmiş olan öğelerle hazırlanmış bir form. İsim: Soyadınız: Sayfam Hakkındaki düşünceleriniz Müthiş Orta Berbat Eleştiri veya istekleriniz için Beni E-mail listenize kaydedin

Sayfadan Ayrılınca Veda Mesajı Sayfanız ne kadar güzel yada içeriği güzel olsada kullanıcı sayfanızdan elbette ayrılacaktır.Tabii artık sayfanızı ziyaret ettikleri için bir teşekkür yada küfür edebilirsiniz.(-:hehe:-) İşte bunun için güzel bir script.Kullanıcı sayfanızdan ayrıldığı yada browserı kapattığında açılan yeni bir pencere içerisinde istediğiniz her şeyi söyleyebilirsiniz.İşte bu güzel scriptin kodları. <html> <title>Yine bekleriz yada Defol git(bunu tavsiye etmem)</title> <head> <script language="JavaScript"> <!- Hide from Javascript-Impaired browsers locnm=location.href; pos=locnm.indexof("indexb.htm"); locnm1=locnm.substring(O,pos); function ByeWin(){ windowIMA=window.open("",'anim2','toolbar=no,location=no,directories=no,menubar=no, scrollbars=no,status=no,resizable=1,width=360,height=290') windowIMA.document.write("<html><title>dinamit UĞURLAMA PENCERESİ</title>" +"<body bgcolor='black' text='white'><center>" +"<form method?get action=""+locnm1+"h5s3.html'>" +"<p><font size=4><b>Merhaba<p>Ziyaretiniz Doğrusu Beni Çok Mutlu Etti." +"<br>Her Zaman Beklerim<br>Görüşmek Üzere" +"<br>firavun © 1999</b></font></form><br>"); } //end hiding -> </script> </head> <body bgcolor=yellow text=balck onunload="ByeWin()"> <hr> <center><h1>Sayfamdan ayrılın bakalım ne ile karşılaşacaksınız</h1></center> <hr> </body> </html>	İŞLETİM SİSTEMİNİ BULMA Yine bu teknikte Java yardımıyla hazırlanmıştır. Bu genelde sayfanıza giren kişilerin hangi işletim sistemini (Win 9x,Linux vb.) kullandığını bulmak için yapılmıştır ve oldukça basittir. <HTML> <SCRIPT LANGUAGE="JavaScript"> <!-- function checkOS() { if(navigator.userAgent.indexOf('IRIX') != -1) { var OpSys = "Irix"; } else if((navigator.userAgent.indexOf('Win') != -1) && (navigator.userAgent.indexOf('95') != -1)) { var OpSys = "Windows 95"; } else if(navigator.userAgent.indexOf('Win') != -1) { var OpSys = "Windows3.1 veya NT"; } else if(navigator.userAgent.indexOf('Mac') != -1) { var OpSys = "Macintosh"; } else { var OpSys = "diğer…"; } return OpSys; } // --> </SCRIPT> <BODY BGCOLOR="#FFFFFF"> İşletim sisteminiz: <b> <SCRIPT LANGUAGE="JavaScript"> <!-- var OpSys = checkOS(); document.write(OpSys); // --> </SCRIPT>
RENK DEĞİŞTİREN BUTONLAR Bilindiği gibi birçok sayfada kullanılan tıklama efekleri yada buton üzerindeyken başka işlemlerin gerçekleşmesi olayları sörfçülerin ilgisini çok çeker. Bu nedenle çoğu tasarımcı Flash,Java tarzı programlar yardımıyla bu tip işlemler yağar fakat bunların açılması oldukça uzun sürer(Türkiyede)Bu nedenle bu script çok kullanışlı ve hızılıdır.Bu işlemi yapmadan önce butonnuzun normal halini(sayfada görüneceğini hali), üzerine gelindiğindeki halini ve tıklandığı zamanki hali olmak üzere üç farklı yada aynı resmi aynı boyutlarda ve formatlarda hazırlayıp bir kenara koyun.Ben Mavi,sarı ve kırmızı olmak üzere üç farklı buton kullandım. <html <head> <title>firavun© Hareketli Buton Script</title> </head> <body color="white"> <script language="javascript"> <!- // bname=navigator.appname; bver=parselnt(navigator.appversion); if(bname00"Netscape"&&bver>=3) browserver=1 else browserver=2; if(browserver==1) { next1=new image(120,30); next1.src="mavi.jpg"; next2=new image(120,30); next2.src="sarı.jpg"; next3=new image(120,30); next3.src="kırmızı.jpg"; } function hlight(imgorg.imgswağ) { if (browserver==1) { document.images[imgorg].src=eval(imgswap+".src") }} function test() { } //-> </script> <a href=sonra.html" on mouseover="hlight('next','next2')" on mousedown="hlight('next','next3') on mouseup="hlight('next','next2') on mouseout="hlight('next','next1') <img src="mavi.jpg" alt="ileri" border="0" name="next"></a> </body> </html>	sağ tuş koruması <!-- Begin function right(e) { if (navigator.appName == 'Netscape' && (e.which == 3 \|\| e.which == 2)) return false; else if (navigator.appName == 'Microsoft Internet Explorer' && (event.button == 2 \|\| event.button == 3)) { alert('sen hala sağ tuşla mı oynuyon şişşşş olm çek elini ondan '); return false; } return true; } document.onmousedown=right; if (document.layers) window.captureEvents(Event.MOUSEDOWN); window.onmousedown=right; // End -->
VİDEOYA DÖNÜŞEN RESİM DYNSRC tag'ını daha önce duymuş muydunuz? Bu takıyı kullanarak asli görevi resim olmak olan bir görüntüyü üzerine gidildiğinde veya yüklendikten hemen sonra görülen bir videoya çevirebilirsiniz. <IMG… komutuyla kullanılan ve sadece Internet Explorer Web tarayıcısında çalışan bu özellik videoları oynatmanın güzel bir yoludur. Sadece Internet Explorer'ın bir özelliği olduğundan <EMBED SRC..> komutu kadar rağbet görmeyen bu komut kullanıcıyı videonun yüklenmesini beklerken oyalamakta kullanılabilir. Küçük AVI dosyaları kullanarak resmin üzerine gidildiğinde kullanıcıyı etkilemek yine bu yolla çok kolaydır. Komutun kullanımı şöyledir: <IMG SRC="DENEME.GIF" DYNSRC="DENEME.AVI" START= FILEOPEN\| MOUSEOVER> FILEOPEN Video yüklenen kadar resmi görüntüler, sonra video'yu oynatır. Varsayılan değer budur. MOUSEOVER Kullanıcı farenin imlecini resim üzerine götürdüğünde video'yu başlatır. DURUM ÇUBUĞUNDA YANIP SÖNEN YAZI Aşağıdaki Javascript durum çubuğuna yanıp sönen bir yazı yerleştiriyor. Kullanıcı herhangi bir URL üzerine gittiğinde devreden çıkan yazı hiç bir kısayol üzerine gidilmediğinde yine yanıp sönmeye başlıyor. Oldukça dikkat çekici ve değişik... <SCRIPT language="JavaScript"><!--- var yazi = "Yanip sönen yazilarla dikkat cekebilirsiniz..."; var hiz = 150; var control = 1; function flash() {if (control == 1) {window.status=yazi; control=0;} else {window.status=""; control=1;} setTimeout("flash();",hiz);} // --></SCRIPT> <BODY OnLoad="flash();">	ZAMANLAYICI Öyle bir Web sayfanız var ki sayfaya bağlanan kullanıcılara o sayfayı izlemek için belirli bir süre vermek istiyorsunuz. Kalan süre bir şekilde kullanıcıya aktarılsın ve süre bittiğinde kullanıcıya bir mesaj kutusuyla haber verilerek başka bir sayfa yüklensin. Bir test sayfası hazırlıyorsanız ya da sayfaların belirli bir süre sonra zamanının dolmasını istiyorsanız aşağıdaki JavaScript tam size göre, kodlar kullanıcıya istediğiniz kadar zaman vermenize olanak tanıyor. <HTML> <TITLE>Zamanlayıcı</TITLE> <SCRIPT LANGUAGE="JavaScript"> <!-- function display() { rtime=etime-ctime; if (rtime>60) m=parseInt(rtime/60); else m=0; s=parseInt(rtime-m60); if(s<10) s="0"+s window.status="Kalan Süre: "+m+":"+s window.setTimeout("checktime()",1000) } function settimes() { alert("Bu testi tamamlamak için 5 dakikanız var.") var time= new Date(); hours= time.getHours(); mins= time.getMinutes(); secs= time.getSeconds(); etime=hours3600+mins60+secs; etime+=300; checktime(); } function checktime() { var time= new Date(); hours= time.getHours(); mins= time.getMinutes(); secs= time.getSeconds(); ctime=hours3600+mins*60+secs if(ctime>=etime) expired(); else display(); } function expired() { alert("Süre Doldu"); location.href="Sonraki.htm"; } // --> </SCRIPT> <BODY BGCOLOR="#FFFFFF" onLoad="settimes()"> <P><font size=+2 face=arial><b>Zamanlayıcı</font></b><p> Bu Javascript kullanıcıya belirli bir miktar süre vererek verilen süre bitince sayfanın otomatik olarak başka bir yere yönlenmesini sağlar. <HR> <FORM> <INPUT TYPE="button" VALUE="tamamla" onClick="location.href='bitti.html'"> </FORM> <hr> Yukarıdaki 300 değerini dilediğiniz gibi değiştirerek verilen süreyi ayarlayabilirsiniz. 300 sayısı verilen saniyeyi belirtmektedir. Verilebilecek en fazla zaman ise 60 dakikadır
SAYFA KENDİSİNİ KAPATSIN Öyle bir web sitesi oluşturdunuz ki bir sürü yardımcı pencere açıyor…. Öyle ki kullanıcılar artık açılan bu yeni pencerelerin içinde boğulduklarından şikayet ediyorlar. Endişelenmeyin tam sizin durumunuza göre bir püf noktası vereceğiz şimdi. Aşağıdaki 4 satırlık HTML kodunu sayfanıza eklediğinizde kodu eklediğiniz alanda bir düğme oluşacaktır. Artık kullanıcılarınız bu düğmeye basarak pencereyi rahatlıkla kapatabilir. Şimdi siz "İyi de güzelim kullanıcılarım pencerenin sağ tarafındaki çarpı tuşuna basmayı zaten akıl edebilirlerdi." diyeceksiniz. Bence bu tuş aynı zamanda sayfanın izlendikten sonra işinin bittiğinin de bir göstergesi. <FORM> <INPUT TYPE="BUTTON" VALUE="Kapat" NAME="lowerButton" onClick="self.close()"> </FORM>	İSTENİLEN BOYUTLARDA YENİ BİR PENCERE Aşağıdaki kodları istediğiniz boyutlarda başlık çubuksuz, gezinme tuşları olmayan bir pencere açmak için kullanabilirsiniz. Yazdığımız Javascript PopIt adlı bir fonksiyon oluşturuyor ve sayfanın herhangi bir yerinden bu fonksiyonu çağırmamıza olanak tanıyor. Ben örneğimde fonksiyonun bir tuşa basıldığında çağrılmasını sağladım. Örneğin sayfa açılırken aynı anda başka bir pencere açılsın istiyorsanız <BODY onload="PopIt('deneme.htm', 160, 300)"> gibi bir ifade kullanabilirsiniz. <HTML> <title>İstenilen boyutlarda yeni bir pencere</title> <SCRIPT LANGUAGE="JavaScript"> <!-- function PopIt(filename, h, w){ popup = window.open(filename,"popDialog","height="+h+",width="+w+",scrollbars=no") if ( popup.document.close() ) { popup.document.close() } } // --> </SCRIPT> <BODY BGCOLOR="#FFFFFF"> <FORM> <INPUT TYPE="BUTTON" VALUE="Penceremi aç!" onClick="PopIt('deneme.htm', 160, 300)"> </FORM> </BODY> </HTML>

tarih sayfanıza koyabileceğiniz tarih scripti <p><font color="#0000FF" size="2"><script language="JavaScript"><!-- var tarih=new Date() var yil=tarih.getYear() var ay=tarih.getMonth() var gun=tarih.getDate() var gun2=tarih.getDay() if(ay==0){ay="Ocak"} if(ay==1){ay="Şubat"} if(ay==2){ay="Mart"} if(ay==3){ay="Nisan"} if(ay==4){ay="Mayıs"} if(ay==5){ay="Haziran"} if(ay==6){ay="Temmuz"} if(ay==7){ay="Ağustos"} if(ay==8){ay="Eylül"} if(ay==9){ay="Ekim"} if(ay==10){ay="Kasım"} if(ay==11){ay="Aralık"} if(gun2==0){gun2="Pazar"} if(gun2==1){gun2="Pazartesi"} if(gun2==2){gun2="Salı"} if(gun2==3){gun2="Çarşamba"} if(gun2==4){gun2="Perşembe"} if(gun2==5){gun2="Cuma"} if(gun2==6){gun2="Cumartesi"} var bos=" " toplam=document.write("<font face=\"Arial\"> Bugün: " +gun+bos+ay+bos+yil+bos+bos+gun2+ "</font>") // --></script></font></p>	saat güzel bir saat scripti üstüne tıklayınca sayfada kaç saniye kaldığınızı gösteriyor <script language="JavaScript"><!-- // Begin day = new Date(); miVisit = day.getTime(); function clock() { dayTwo = new Date(); hrNow = dayTwo.getHours(); mnNow = dayTwo.getMinutes(); scNow = dayTwo.getSeconds(); miNow = dayTwo.getTime(); if (hrNow == 0) { hour = 12; ap = " AM"; } else if(hrNow <= 11) { ap = " AM"; hour = hrNow; } else if(hrNow == 12) { ap = " PM"; hour = 12; } else if (hrNow >= 13) { hour = (hrNow - 12); ap = " PM"; } if (hrNow >= 13) { hour = hrNow - 12; } if (mnNow <= 9) { min = "0" + mnNow; } else (min = mnNow) if (scNow <= 9) { secs = "0" + scNow; } else { secs = scNow; } time = hour + ":" + min + ":" + secs + ap; document.form.button.value = time; self.status = time; setTimeout('clock()', 1000); } function timeInfo() { milliSince = miNow; milliNow = miNow - miVisit; secsVisit = Math.round(milliNow / 1000); minsVisit = Math.round((milliNow / 1000) / 60); alert("FİRAVUN online I " + secsVisit + " saniyedir ziyaret etmektesiniz. Sitemize hoş geldiniz. "); } document.write("<form name=\"form\">" + "<input type=button value=\"Click for info!\"" + " name=button onClick=\"timeInfo()\"></form>"); onError = null; clock(); // End // --></script>