Vürüs Temizleme işlemi

Virüs Temizleme İşlemleri :

1. Önce makineyi kapatınız.

2. Açılış disketini takınız. (Sistem disketi) Eğer yoksa temiz bir makineden Başlat-Ayarlar-Denetim Masası –Program Ekle/Kaldır bölümünden başlangıç disketi oluşturmalısınız.

3. Makineyi disket takılı iken açınız. A:\> sürücüsü gelene kadar bekleyiniz.

4. Sistem tarihini değiştiriniz.
A:\> iken DATE yazıp enter’e basınız.
Yeni tarih bölümüne 22-02-1998 yazıp enter’e basınız.
Not: F-PROT programı eski versiyon olması nedeniyle yeni tarihte çalışmaz.

5. Açılış disketini çıkarınız.

6. Antivirüs olan (f-prot) disketi takınız.

7. A:\>F-PROT yazıp enter’e basınız.

8. Karşınıza gelen gri sayfayı enter’e basarak geçiniz.

9. Scan yazan yerde iken ENTER’e basılır.

10. Method : Secure Scan
Search : Hard disk
Action : Automatic disinfection
Targets : Boot /File/Packed/Docs
Files : All Files

şeklinde olmalıdır.

11. Begin Scan üzerinde enter’e basılır. Gelen kırmızı uyarıya enter’e basılır.

12. Virüs taraması başlayacaktır. Bulduğu virüsleri kırmızı bir ekranda gösterecektir.

13. Bütün virüsleri temizledikten sonra makineyi kapatınız.

14. Tekrar açarken disketi çıkarınız. Artık makinenizin tarihinide bugün kü tarihe çeviriniz

Karşılaşacağınız her türlü sorunlar için lütfen serdar_aydemir@ktg.com.tr adresine email atınız.

Başarılar dilerim.

Not: Eğer F-PROT programınız yok ise intranet sayfasından Bilgisayar Yardım bölümünden virüsler bölümüne açarak oradan indirebilirsiniz. Dosya sıkışmış halde inecektir. Winzip yada pkunzip komutları ile açabilirsiniz.

Vürüsler Nedir?

VİRÜSLER
Virüsler, genellikle bilgisayara zarar vermek amacıyla yazılmaktadır.
Virüslerin Yayılışı:
Virüslerin bir başka programa yapışarak yayılmaktadır. Bir virüs, kelime işlemci, tablolama programı, e-posta programınıza,dosyalarına, boot (hard disk veya disketinizin başlangıç adresine) yerleşerek sürekli çoğalır ve yayılır. Virüsü kapmış olan dosya ya da disket, bilgisayara takılıp içindeki dosya açıldığında virüs çalışmaya başlar. Genellikle belleğe gider ve orada diğer dosyalara bulaşmak için fırsat bekler. Bir sonraki çalışan program ya da dosya veya diskete bulaşır.
Virüslerden bazıları, belli tarihlerde çalışıp ekrana resim, mesaj çıkarır (etkisi az olan virüsler). Bazıları ekran ayarlarını değiştirir ya da sisteminizin yavaşlamasına neden olur (orta şiddette etkili virüsler). Bazıları da veri kaybı, sistem çökmesi, dosyaların hasar görmesine neden olur (çok zararlı virüsler).
1. Dosyalara bulaşan virüsler: Genellikle COM, EXE uzantılı dosyaların kaynak koduna kendilerinin bir kopyasını eklerler. SYS, DRV, BIN, OVL, OVY uzantılı dosyalara da bulaşan virüsler de vardır. Bazı virüsler dosyaların açılmasını beklemeden de çoğalabilir. Örneğin DOS'da DIR çekildiğinde diğer dosyalara bulaşan virüsler de vardır.
Dosyalara bulaşan virüslerin büyük bir kısmı, EXE dosyanın başlangıç kodunu alarak başka bir yere yazar. Dosya çalıştırıldığında önce virüs harekete geçer, başlangıç kodunu çalıştırır. Her şey yolunda gidiyormuş görünür. Bazıları da COM uzantılı ikinci bir dosya yaratarak içine kendi kodunu kopyalar. DOS tabanlı işletim sistemleri önce COM uzantılı dosyaya bakacağından farkında olmadan virüsü çalıştırır.
2. Boot sektörü virüsleri: Disk ve disketlerde (A, C, D, E, ...) olarak bilinen mantıksal bölümlerin her birinde boot sektörü vardır. Boot sektörde diskin formatı ve depolanmış verilerin bilgileriyle DOS'un sistem dosyalarını yükleyen boot programları bulunur. Bir boot virüsü boot dosyalarına bulaştığında, bu disk veya disketten bilgisayar açılmaya çalışıldığında "Non-system Disk or Disk Error" mesajı verilerek bilgisayar açılmaz. 1996 yılına kadar en yaygın virüsler bu cins virüslerdir. Boot virüs, belleğe yerleştikten sonra takılan her diskete bulaşır.
Master Boot Record Virüsleri: Sabit diskin ilk fiziksel sektörlerinde diskin Master Boot Record'u ve Partition Tablosu vardır. Sabit Diskin Master Boot Record'unun içindeki Master Boot Programı partition tablosundaki değerleri okur ve boot edilebilir partition'ın başlangıç yerini öğrenir. Sisteme o adrese git ve bulunduğun ilk program kodunu çalıştır komutunu gönderir. Bu virüsler de boot sektör virüsleri gibi bulaşır.
Multi-Partite Virüsler: Boot Sektörü virüsleri ile Master Boot Record virüslerinin bileşimidir. Hem MBR'a hem boot sektörü ve çalıştırılabilir dosyaları bozarak yayılma şanslarını bir hayli artırmış olurlar.
3. Macro Virüsleri: Microsoft Word ve Microsoft Excel gibi popüler uygulama programlarının macro dillerini kullanılarak yazılıyorlar. Macro'lar veri dosyalarında kaydedildiği için virüslü belge açıldığında virüsün makro kodu çalışmaya başlar.
4. Script Virüsler:
Trojan Horse (Truva Atı): Bilgisayarınızda arka planda çalışan ve zamanı geldiğinde aktif hale gelerek sisteminize zarar veren yazılım. Sabit diski formatlamak, dosyaları silmek ya da çökertmek gibi çok zararlı işler yapar. Kötü amaçlı program olmalarından dolayı virüslere benzetilebilir. Benzemeyen yönleri ise, Truva atlarının zararsız bir programmış gibi gözle görülür olmaları ve kendi kendilerini çoğaltarak başka bilgisayarlara yayılmamalarıdır.
Windows 95/98 veya Nt kullanıyorsanız trojanlara ( casus yazılım diyebiliriz.) çok dikkat etmelisiniz. Bu tip bir trojan size nasıl ulaşabilir ?

1) Elektronik posta yolu ile kötü niyetli veya şakacı bir arkadaşınız tarafından yollanabilir.
2) IRC kanallarında chat yaparken size birisi bakın bu çok hoş bir program mutlaka al diyerek sizin trojan yazılımı bilgisayarınızda çalıştırmanıza sebeb olabilir.
3) CD-ROM veya disket yolu ile başka bir kullanıcıdan gelebilir. Eğer bilgisayarınızda trojan yazılımı engelleyen bir koruma programınız ( yani iyi bir anti - virus yazılımınız ) yoksa başınıza gelebilecek olaylar şunlar olabilir ..Tabii bunlar sadece Internet bağlantınız varken geçerli olabilir.
Trojanın sizde aktif olduğunu bilen kişi ;
- Sabit disklerinize cd rom veya diğer disket sürücülerinize sizin ulaştığınız rahatlıkla ulaşabilir.
- Sabit veya taşınabilir disklerinize her türlü işlemi yapabilir.
- İnternet şifrenizi öğrenebilir.
- İstediği dosyayı okuyabilir, silebilir.
- İstediği dosyayı kendi bilgisayarına indirebilir.
- İstediği dosyayı sizin bilgisayarınıza yükleyebilir.
- Sizin yazdıklarınızı izleyebilir. Eğer kamera takılıysa sizi canlı olarak izleyebilir.
- Bilgisayarınızda çalışan herhangi bir programı kapatabilir.
- Eğer bir bilgisayar ağına sahipseniz sizin sayenizde tüm ağ üzerinde işlem yapabilir.
- Bilgisayarınızı kapatabilir veya yeniden başlatabilir.
Bu yukarıdaki özellikleri Netbus ve BO adlı trojan yazılımlar çok rahat gerçekleştiriyor. Bu yüzden siz siz olun mutlaka trojanlardan korunun.
Worm: Bellekteki ve diskette eriştiği bölgelerin verilerini bozar. İçine gömülüp saklanacağı bir ev sahibi programa gereksinimi olmadığından virüslerden ayrılır.
Virüsler, bilgisayarın işleyişinin kesilmesine, dosyaların silinmesine, sistemin yavaşlamasına yol açar. Virüsler, disketlerde bulunan programların içinde gizlenmiş olarak bulunur. Disket, disket sürücüye takılıp, virüslü dosya veya disket okutulduktan ya da içindeki programlar çalıştırıldıktan sonra bilgisayara geçer.
Spam: bir mesajın arka arkaya gönderilmesi. Spam ağı tıkar, pdsta dağıtımını yavaşlatır. Bir tür virüs olarak nitelenebilir. Ardarda gelen gereksiz elektronik postalar yüzünden bilgisayarda çalışamaz hale gelebilirsiniz.
Sabit Diskleri virüslerden korumak gereklidir.
Virüslerden korunmak için ipuçları:
• Virüs arama programı kullanın. Virüs tarama programınızı internetten bir kaç günde bir güncelleyin.
• Birden fazla virüs programı kullanın. Her virüs programı bütün virüsleri tanımaz.
• Temiz açma disketi bulundurun.
• Disketleri ve elektronik postaları virüs tarama programından geçirmeden açmayın.
• Bilmediğiniz dosyaları açmayın.
• Tanımadığınız birisi tarafından gönderilen dosyaları açmayın.
• Virüs uyarılarını dikkate alın.
• Her zaman dosyalarınızın yedeğini alın.
• BIOS setup'ından Boot sırasını C:, A: yapın. Böylelikle disket sürücüde unutulmuş olan virüslü disketten Sabit diske açılış sırasında virüs geçmesi önlenmiş olur.
•
Virüsler ayrıca modemle iletişim sırasında da geçebilir. Ayrıca kopya programlarda da virüs bulunabilir.
antivirus programlarının bulunduğu siteler:
http://www.avp.com
http://www.mcafee.com
http://www.symantec.com
http://www.datafellows.fi
http://www.antivirus.com
http://www.hitchhikers.net/antivirus/antivirus-dis.phtml : antivirüs programlarının güncellemeleri hakkında bilgi veren site
http://www.members.aol.com/rlink: virüs sorunu ile ilgili güncel bilgiler.
http://www.wildlist.org :yeni yayılan virüslerin listesi aylık olarak yayınlanır.
http://www.virusbtn.com :virüslerle ilgili ipuçları

JAVASCRİPT DERS NOTU

JavaScript Nedir?

JavaScript ve CGI dillerinden öce web sayfaları sadece statik verileri bulundurabiliyordu. Sadece HTML etiketlerinden oluşan sitelere resim ve düz metinler yerleştirilerek, linklerle birbirine bağlanabiliyordu. JavaScrip HTML’i durgun halinden çıkararak dinamik bir yapıya kavuşturmuştur. Böylece dokümanlar kullanıcının bilgisayarına yüklendikten sonra bile düzenlenebilmektedir.
JavaScript’le yapılabilecekleri iki temel gruba ayırabiliriz.
1. Dinamik olarak HTML etiketi üreterek doküman oluşturmak,
2. Tarayıcıya yüklenmiş dokümandaki HTML nesnelerini ve kullanıcının tarayıcısına ait pencereleri düzenlemek.
Birinci maddede söz edilen dinamik HTML kodu üretimi daha çok CGI dillerinin görevidir. PHP,ASP,Perl gibi CGI dilleri sunucu tarafında çalışır ve dinamik kod üretir. Java Script ise istemci tabanlı çalışan bir dildir.
JavaScriptin komut dizili yapısı hemen hemen C/C++ diliyle aynıdır. Bu nedenle daha önce C/C++, Java veya PHP gibi dillerle uğraşanlar JavaScript dilinin komut yapısını biliyor sayılır.

JavaScript’e Giriş:






Bir mesaj kutusu açıldı



Yukarıdaki ilk JavaScript örneğinde dikkat edilmesi gerek üç önemli nokta vardır.
1. JavaScript komutları etiketleri arasına yazılır. ile biter.Language özelliğinin yazılması zorunlu değildir.
2. etiketleri içerisinde JavaScript bloklarını istediğiniz yere koyabilirsiniz. Ancak genel alışkanlık olarak bloğu içerisinde





Öncelikle JavaScript’le bir tablo oluşturuluyor. Bunun için aktif dokümana write metodu ile tablo oluşturmayı sağlayan HTML kodların yazılması yeterlidir. Bu tablo 2 sütundan oluşur. Daha sonra for döngüsü ile bu tablonun içerisine santigrad ve karşılığı fahrenhayt yazdırılıyor. Döngünün her adımında bir satır oluşturuluyor. Döngü sonunda ise tablo sonlandırılıyor.
• While döngüsü: Bir koşul doğru olduğu sürece bir grup komutu tekrarlayan döngü türüdür.


while (koşul) { // komut bloğu
}
• Küçük harflerden oluşan while ifadesiyle başlar
• Parantez içerisinde mantıksal bir değere içeren koşul ifadesi bulunur.
• Döngü koşul doğru olduğu sürece çalışır.











• do…while Döngüsü: Bu döngü tipi while döngüsüyle hemen hemen aynıdır. Aralarındaki tek fark do…while döngüsünde koşulun sonda kontrol edilmesidir. Bu nedenle bu döngü her koşulda en az birkez çalışacaktır. While döngüsünde ise kontrol başta olduğu için döngünün hiç çalışmaması söz konusudur.
do{
// komut bloğu
}while (koşul)
• döngü ifadesi küçük harflerden oluşan do ve while sözcükleri arasında yer alan küme parantezleri arasındaki komutları çalıştırır.
• Koşul ifadesi sondaki while ibaresiyle belirtilir.
• Koşul doğru olduğu sürece döngü devam eder.



• berak Deyimi: Döngüden koşul dışı çık!. Bazı özel durumlarda koşulu beklemeden döngüyü terk etmek gerekebilir. Bu durumda break deyimi sanki koşul yanlış sonuç üretmiş gibi döngüyü sona erdirir. Örneğin kullanıcı CANCEL butonuna bastığında döngüden çıkılabilir.
…
do {
n++;
var sayi=prompt(n+”. Sayınız ?”,0);
if (sayi==null) break;
toplam+=parseFloat(sayi);
}while (sayi!=0);
…
• continue Deyimi: continue deyimi döngü içinde döngüyü o noktada bırakıp, alttaki komutları atlayarak, koşul ifadesinin bulunduğu while veya for deyiminden devam eder.
…
do {
n++;
var sayi=prompt(n+”. Sayınız ?”,0);
if (sayi==null) break;
if (isNaN(sayi))
{
n--;
alert(“bir sayı girmeniz bekleniyor!”);
continue;
}
toplam+=parseFloat(sayi);
}while (sayi!=0);
…
isNaN fonksiyonu JavaScript’in hazır fonksiyon kütüphanesindendir. Parametreyle verilen değerin sayısal bir değer olup olmadığını belirten boolean bir değer döndürür.






Javascript’te Fonksiyonlar:
Javascript, klasik HTML’in yapamadığı şeyler yapabilir; ziyaretçiden veya ziyaretçinin Browser programından alacağı bir bilgiyi değerlendirerek bir dizi işlem yapabilir; ziyaretçiyi sitemizde belli bir sayfaya yönlendirebilir; kısaca sayfalarımıza ziyaretçi ile etkileşme imkanı kazandırır.
Çoğu zaman sayfanızdaki bir Javascript işleminin defalarca yapılması gerekebilir. Hatta öyle işlemler olur ki, Javascript, başka bir işi yapmadan önce, mutlaka bu işlemi yapmak isteyebilir. Bu tür tekrarlanan işleri, bu işin yapılması için gerekli bilgi kümesi ve komutlarla birlikte bir grup haline getirsek ve bu gruba bir isim verirsek kod tekrarından kurtulmuş oluruz.. Sonra bu iş kümesine ihtiyaç olduğu yerde sadece ismini kullanarak aynı kod bloğunu çağırabiliriz. İşte bu tür, bir isim altında toplanmış işlem paketlerine Function (işlev) adı verilir; Javascript kendisine “Şu fonksiyonu yap!” dediğiniz noktada yapmakta olduğu durdurur ve fonksiyon paketindeki işleri yapar; bu paket ortaya bir değişken veya sonuç çıkartıyorsa, o bilgiyi edinmiş olarak fonksiyon için yarım bıraktığı işleme geri döner.

Genel hatlarıyla fonksiyon, şu formüle göre yazılır:
function fonksiyonun_adı (argüman1, argüman2, ... argümanN){
//işlemler
}
Fonksiyonlar mutlaka SCRIPT etiketinin içinde yer alır. Daha sonra kullanılacak (çağrılacak) olsa da bütün fonksiyonlarınını HTML dosyasının HEAD bölümüne koymanız, Browser’ın Javascript yorumlayıcısı bakımından sürat sağlar. İyi bir programlama tekniği, bir sayfada gerekli bütün fonksiyonları, altalta, HTML’in HEAD bölümünde yer alacak bir SCRIPT etiketi içinde beyan etmek; sonra ihtiyaç olduğu yerde yeni bir SCRIPT etiketi koyarak bu fonksiyonu göreve çağırmaktır.
Bir fonksiyon, kendisini göreve çağıran komuttan veya fonksiyondan veri kümesi (argument) alabilir. Buna bir değerin fonksiyona geçirilmesi, ulaştırılması, verilmesi denilir. Bir fonksiyon, bir ya da daha fazla argüman alabilir. Fonksiyonun argümanları, bir isim altında toplanır ve bu bilgi kümesinin bölümlerine bu isimle atıfta bulunulur.
Fonksiyona değer gönderme ve değer alma;
Bir fonksiyon ile Javascript programının diğer işlemlerinin ilk ilişkisi fonksiyona bir değer gönderme ve ondan bir değer almaktır. Bir fonksiyon, yaptığı işin sonucu olarak, kendisini göreve çağıran komuta veya fonksiyona kendi adıyla bir değer verebilir. Fonksiyondan değer döndürmek için ”return” operatörü kullanılır. Fonksiyon return operatörünü gördüğü yerde fonksiyona son vererek belirtilen sonucu çağırıldığı yere döndürür.
Bir örnek üzerinde düşünmeye başlayalım. Ziyaretçinizden telefon numarasını yazmasını istiyorsunuz. Ziyaretçi de sayfada bir INPUT kutusuna veya PROMPT diyalog kutusuna telefon numarasını yazıyor. Bu numarayı, sayfada başka bir programda veya bölümde kullanmadan önce, gerçekten doğru yazılıp yazılmadığını irdelemek istiyorsunuz. Ziyaretçinin verdiği telefon numarasını bir fonksiyona havale edebilirsiniz; bu fonksiyon telefon numarası arzu ettiğimiz biçimde yazılmışsa olumlu, yazılmamışsa olumsuz yanıt verebilir. Bütün yapacağımız şey, ziyaretçiden alacağımız bilgiyi, bu fonksiyona argüman olarak geçirmekten ibaret; fonksiyonun sonuç olarak verdiği değer doğru ise işleme devam edeceğiz, değilse ziyaretçiyi uyararak, doğru bilgiyi girmesini isteyeceğiz.

Bu sayfada, önce “if(dogruMu(numara))” şeklindeki ifadeye dikkat edelim. Javascript, bu noktada “dogruMu” fonksiyonu çağıracak, bunu yaparken de fonksiyona “numara” adı altında bir değer geçirecektir. Fonksiyondan bütün beklediğimiz “if” sorgulamasına “true” (doğru) veya “false” (yanlış) şeklinde bir karşılık vermesidir
Fonksiyonun gerçekten kendisine verilen bilgilerin, arzu edilen biçime uygun olup olmadığını sınaması gerekir. Bu bilgiyi tutan “numara” nesnesi, nesne olduğu için bazı özelliklere sahiptir; bu özelliklerden biri de uzunluğudur. Önce bu uzunluğun 13 karakter olup olmadığına bakıyoruz. Ziyaretçi, telefon numarasını yazdığı halde parantezleri veya kesme çizgisini unuttuysa, verdiği bilgilerin uzunluğu 13 karakterden az olacaktır, yani “numara.length” 13 olmayacak, “durum” değişkenin değeri “false” olarak değiştirilecektir. Numaranın karakter sayısı 13 ise, fonksiyonumuz 13 karakteri, bir “for” döngüsü çerçevesinde tek tek irdelemeye başlayacaktır. Her bir karakteri almak için charAt(i) fonksiyonu kullanılıyor
parseInt(i,n) fonksiyonu ile karakterlerin rakam olması kontrol edilmektedir. İkinci parametre çevirme işleminin tabanını ( 10 tabanlı, 8 tabanlı) belirtmektedir.
Şimdi yeni bir fonksiyon yazarak, Browser’ın, bilgisayarın işletim sisteminden saat ve tarih bilgisi edinerek, Javascript’e ulaştırmasını sağlayalım.

Şu anda saat:

Bu Javascript kodunda tanımladığımız değişkenin, Javascript’in otomatik bir metodundan değişken elde ettiğini görüyorsunuz.
Date(): getYear(), getMonth(), getDate(), getDay(), getTime(), getHours(), getMinutes(), getSeconds()
Bu metod, Javascript’in Browser’dan, Browser’ın işletim sisteminden, işletim sisteminin de bilgisayarın temel girdi/çıktı işlemlerini yapan (BIOS) çipinden, saati ve tarihi içeren bilgiyi almasını sağlar. Gerçi metod Date (günün tarihi) adını taşıyor, ama Date(), Javascript açısından class (sınıf) sayılır ve edinilen bilgi sadece ay, gün ve yıl bilgisini değil, o andaki saati, dakikayı ve saniyeyi de içerir.
“saat” adını verdiğimiz bu değişken, Date() metodunun sağladığı bütün bilgileri içerdiği için, içinden saate ilişkin bilgiyi söküp almamız gerekir. Date() sınıfının sağladığı bilgiyi, get... yoluyla alırız.
toString(), toLowerCase(), toUpperCase()
Javascript’in kullanılmaya hazır işlevleri (metodları) arasında Date (Tarih) nesnesine uygulanabilecek olanlarından biri toString() metodudur. Kelime anlamı String’e çevir, alfanümerik’e çevir olan bu metodla, saat nesnesinin tamamen kendine özgü biçimi, Javascript tarafından HTML’in anlayabileceği şekle çevrilmiş olur. Buradaki örnek kodda, “saat” değişkeninin içeriğini toString() metoduna tabi tutarak, alfanümerik değere çeviriyoruz ve bunu, HTML sayfasındaki Form nesnesinin “saatkutusu” isimli INPUT ögesinin içeriği haline getiriyoruz.
Javascript’te, çevirme amaçlı iki metod daha vardır. toString() metodu sadece Date nesnesine uygulanabilir, ama toLowerCase() (küçük harfe çevir) ve toUpperCase() (büyük harfe çevir) metodları bütün alfanümerik değerlere uygulanabilir.
setTimeout(“fonksiyonun_adı”, milisaniye)
setTimeout(), Javascript’in 1.2 sürümüyle gelen ve kendi kendisinin zamanlamasını belirleyen bir metoddur. Buradaki örnekte, “kronometre” değişkeninin değeri olarak, “tarihsaat” fonksiyonumuzun, her 1000 milisaniyede bir yenilenmesini istiyoruz. Bunun sonucu, Javascript, fonksiyonu her bin milisaniyede bir çalıştıracak, ve bunun sonucu olarak HTML sayfasındaki formda saatkutusu isimli kutunun değeri sürekli yenilenecektir.
Bu metoddan yararlanarak, Javascript’e, sözgelimi her sabah 6:30’da bir iş yaptırabiliriz. Bunun için, söz gelimi setTimeout metodunu içeren değişkeni, şöyle bir döngü içine koyabiliriz:
if ((saat.getHours() == 6) && (saat.getMinutes() == 30))
{
document.saatForm.saatkutusu.value = saat.toString()
//sonra setTimeout metodunu içeren zamanlama ifadesi gelir:
kronometre = setTimeout("tarihsaat()",10000)
}
Böyle bir döngü içine alındığı zaman kronometre sadece sabah 6:30’da saati ve tarihi gösterecektir.
Değişkenleri Değerlendirme (Eval)
eval() fonksiyonu verilen bir karakter katarını JavaScript ifadesine, nesne ve sayısal bir değere çevirebilir.
var x=”3”;
var y=”5”;
document.write(“
x+y= ”);
document.write(x+y);// sonuç 35
document.write(“
eval(x)+eval(y)= ”);
document.write(eval(x)+eval(y)); // sonuç 8








Değişkenlerin Kapsamı(Variable Scope)
Değişkenlerin kapsamı değişkenin geçerli olduğu alanı belirler. Bu bağlamada değişkenler global ve local olarak isimlendirilir. Yerel değişken fonksiyon içerisinde tanımlanan değişkendir. Gloaba değişken ise

Aynı isimde iki farklı değişken örneğia

Olylar( Events ): Kullanıcıyla iletişim kurarken yada tarayıcıyla ilgi bir işlemde olaylar meydana gelir. Kullanıcının fareye tıklaması, fareyi hareket ettirmesi, klavyede bir tuşa basması, tarayıcısına yeni bir sayfa yüklemesi ve birçok kullanıcı hareketi JavaScript için birer olay tanımlar.
En çok bilinen nesnelerin çok bilinen bazı olayları aşağıda verilmiştir.
Butonların;
• Tıklanması (click)

Tarayıcının penceresinde;
• Yeni doküman yüklenmesi ( load )
• Pencerenin kapatılması ( close )

Metin giriş kutularında
• Bilgi girişi için klavyede bir tuia basılması ( keypress )
• İçerdiğideğerin değiştirilmesi ( change )
• Giriş yapmak için nesnenin seçilmesi (focus)

Linklerin;
• Tıklanması
• Fare imlecinin üzerine gelmesi (move/over)

Resimlerin
• Tıklanması
• Fare imlecinin üzerine gelmesi
• Fare imlecinin üzerinden çekilmesi (blur)

Olay Yönlendiricileri ( Event Handlers):
Her pencere, tarayıcı veya ziyaretçi olayına karşılık JavaScript’in bir olay yönlendiricisi vardır. Bir olay meydana geldiğinde olay yönlendiricisi devreye girerek tanımlanan işleri gerçekleştirir.
Tarayıcıda bazı olaylara karşı kendinden tanımlı metotlar vardır. Fakat istenirse bu olay kendi yazdığınız bir fonksiyona yönlendirilerek istediğiniz işleri yapabilirsiniz. Örneğin bir linke basıldığında ilgili sayfa yüklenecektir. Fakat istenirse JavaScript ile bu olaya müdahale edebilirsiniz ve otomatik olayı devre dışı bırakabilirsiniz.
Olay yönlendiricilerine doğrudan JavaScript kodu yazabilirsiniz;

olay yönlendiricilerinin isimleri oldukça basittir. Olayın ingilizce adının başına “on” ibaresi gelir. Örneğin fare ile tıklama olayının adı “click”, bu olaya ait olay yönlendiricisinin adı da “onClick” dir. Klavyeden bir tuşa basma olayının adı “KeyPress”, bu olaya ait olay yönlendiricisinin adı da “onKeyPress” dir.
Olay yönlendiricileri HTML etiketinin içerisine doğruda JavaScript kodu yazarak yönetilebildiği gibi bir fonksiyona da yönlendirilebilir. Bu şekilde kodun daha anlaşılır ve düzenli olması sağlanmış olur.

Olaylara fonksiyon Tanımlama

---

Yeni Link

confirm() metodu kullanıcıya aldığı mesaj bilgisini gösteren ve OK,Cancel butonlarıyla onay bekleyen bir pencere çıkaracaktır. OnClick olay yönlendiricisindeki return komutuda dönen false değerini olayın sonucu olarak döndürerek olayı bitirmek için kullanılmaktadır.

Aşağıda JavaScript’teki olay yönlendiricilerinin ne zaman çalışacağı bilgisi sunulmuştur;

Olay Yönlendiricisi Ne zaman çalıştırılır.
OnClick Kullanıcı bir link, resim veya form elemanına fareyle tek tıkladığında
OnDblClick Kullanıcı bir link, resim veya form elemanına fareyle çift tek tıkladığında
OnChange Kullanıcı form elemanları üzerinde değişiklik yaptığında
onMouseDown OnClick olayının iki parçasından birincisi (basılması)
onMouseUp OnClick olayının iki parçasından ikincisi (bırakılması)
onMouseOver Kullanıcının bir link veya resim elemanının üzerine fare imlecini getirmesi
onMouseOut Kullanıcının bir link veya resim elemanının üzerinden fare imlecini çekmesi
OnLoad Tarayıcı penceresine bir doküman veya resim yüklemesi
OnUnLoad Kullanıcı yüklü olan dokümanı veya çerçeveyi kapattığında
OnAbort Bir resim yüklemesi yarıda kesildiğinde
OnSubmit Kullanıcı formu sunucuya göndermek için SUBMIT butonuna basması
OnReset Kullanıcı formu ilk haline getirmek için RESET butonuna basması
OnFocus Bir HTML nesnesi seçili duruma geldiğinde
OnBlur Bir HTML nesnesinin seçili durumu kaldırıldığına
OnResize Kullanıcı pencere yada çerçevenin boyutlarını değiştirdiğinde
OnMove Kullanıc pencere yada çerçevenin yerini değiştirdiğinde (taşıdığında)


• onClick Olay Yönlendiricisi
Ziyaretçinin, Mosue işaretçisi tıklanabilir bir nesne üzerinde iken Mouse’nun düğmesine basması, Click olayını doğurur; bu olayı onClick yönlendirir. Düğmeler, işaretleme kutuları, radyo düğmeleri ve bağlantılar tıklanabilir. Olayın oluşması için varsayılan Mouse düğmesinin basılması ve bırakılması gerekir. Düğme basılı durursa, Click olayı gerçekleşmiş olmaz.

Düğmelerden birini tıklayınız!

Butonlara basıldığında r1.html ve r2.html adında iki sayfa ayrı bir pencerede açılacaktır.
• onSubmit Olay Yönlendiricisi
Bir form, ziyaretçi tarafından türü Submit olan bir düğmenin tıklanması halinde, Browser tarafından HTTP protokolü ile Server’a gönderilir. Javascript, onSubmit yönlendiricisi ile bu olaya ilişkin işler yapabilir, fonksiyonlar icra edebilir. Fakat burada dikkat edeceğiniz nokta, “Submit” olayına engel olmamak veya bu işlemi şarta bağladı iseniz, bu şartın yerine gelmesini sağlamaktır.
Form etiketini şöyle yazabiliriz:

Dolayısıyla “onayla()” fonksiyonuna da kendisini göreve çağıran komuta bir sonuç ulaştırması gerektiğini bildirmemiz gerekir:
//onSubmit olayını yönlendirme fonksiyonu
function onayla() {
return confirm(‘Bu siparişi vermek istediğinizden emin misiniz?’);
}
Bu durumda kullanıcı/ziyaretçi “confirm” kutusunun OK (Tamam) düğmesini tıklarsa onSubmit yönlendiricisi Form’u belirtilen CGI programına, işlenmek üzere, gönderecek; Cancel (İptal) düğmesi tıklanırsa, onSubmit yönlendiricisi submit olayını durduracaktır.
• onReset Olay Yönlendiricisi
Formlara koyduğunuz Reset (Başa dön) düğmesi, bir Form’daki bütün bilgilerin silinmesini sağlar; Browser’ın Geri düğmesini tıklamak dahil, hiç bir eylem ziyaretçinin yanlışlıkla bastığı Sil düğmesinin sildiğini geri getiremez. Fakat programcı olarak siz böyle bir hatayı önleyebilirsiniz. Çünkü Sil düğmesinin oluşturduğu “reset” olayını yönlendiren onReset, size bu imkanı verir. Tıpkı onSubmit’teki gibi FORM etiketinize onReset tarafından devreye sokulacak bir doğrulama fonksiyonu koyabilirsiniz. Form etiketiniz şöyle olabilir:

Bu fonksiyonu da HTML’in HEAD bölümünde şöyle yazabilirsiniz:
//onReset olayını yönlendirme fonksiyonu
function sahiMi() {
return confirm(‘Bu formdaki büktün bilgileri silmek istediğinizden emin misiniz?’);
}
Ziyaretçiniz doldurduğu formda, Gönder yerine yanlışlıkla Sil’i tıkladıysa, böylece bir şansa daha kavuşmuş olur.

onChange
HTML sayfanızda olabilecek tek değişiklik, ziyaretçinin içine bir şeyler yazabildiği veya bazı işaretler koyabildiği üç alandır: Text (Metin), Textarea (Metinalanı) ve Select (Seç) etiketleri. Metin ve metinalanın içini tıklayarak Browser Penceresi’nin odak noktasını buraya getiren ziyaretçi klavyesine basarak, bu alanlara metin girebilir; bu HTML sayfasında “change” (değişiklik) olması anlamına gelir Select etiketinin sağladığı şıklardan birini seçen ziyaretçi de sayfada değişiklik olayına yol açar. “change” olayı halinde, onChange bu olayı yönlendirir. Javascript programcısı olarak siz bu yönlendiriciye belirli bir fonksiyonu çalıştırmasını bildirebilirsiniz.
Bunu da bir örnekle ele alalım. Diyelim ki Frame (Çerçeve) esasına dayanan bir ana sayfanız var; ziyaretçinin bir çerçevedeki “select” etiketinin seçeneklerinden birini seçmesi halinde bir diğer çerçevenin içeriği değişsin istiyorsunuz. Ana sayfanızda bir FRAMESET var ve bu üç çerçeveli bir sayfa oluşturuyor. Burada Browser’ın “document” (sayfa) hiyerarşisi içinde Frameset “Parent” (ebeveyn; çünkü diğer bütün Frame'leri o doğuruyor!) ve “Frame 0” (1’nci çerçeve) “Frame 1” (2’nci çerçeve) ve “Frame 2” (3’ncü çerçeve) vardır. “document” nesnesi çerçeveleri bir dizi-değişken içinde tuttuğu ve Array (dizi değişken) numaralanmaya 0'dan başladığı için çerçevelerimiz 0’dan itibaren numaralanıyor. Buna göre sağ Frame'in içeriğini değiştireceğimiz zaman bu çerçeveye "Frame 2" adıyla gönderme yapmalıyız. Frame 1'e şöyle bir FORM koyarsak, daha sonra bu formun değişiklik olayını onChange ile sağ çerçevenin içeriğini değiştirmeye yönlendirebiliriz:

Seç bakalım
Test 1
Test 2
Test 3

Burada, SELECT nesnesinin içeriği, ziyaretçinin herhangi bir seçeneği seçmesi halinde değişmiş oluyor; bu “change” olayı üzerine bu olayı yönlendirmek üzere kullandığımız onChange ise karşısındaki Javascript komutunu icra etmeye başlıyor. Bu uzun kodda, “this” (bu) anahtar kelimesinin yeniden kullanıldığını görüyorsunuz. Bu kelime, herhangi bir Javascript fonksiyonuna ihtiyacı olan bilgileri bu nesneden almasını bildiriyor. “Bu” diye nitelediğimiz nesne, içinde bulunduğumuz FORM’un SELECT ögesidir. SELECT ögesinin OPTION’ları, bu nesnenin OPTIONS dizi-değişkeninde numaralanır ve seçilen OPTION’ın numarası “selectedIndex,” içeriği ise “.value” adıyla adlandırılır. Nesneleri ve özelliklerini ele aldığımız bölümde bu konuya yeniden döneceğiz.
onFocus, onBlur
HTML sayfasında da Browser’ın Focus’unu (dikkat odağını) üzerinde topladığı veya odağın çekildiği üç nesne olabilir: Text (Metin), Textarea (Metinalanı) ve Select (Seç) etiketleri. Çünkü ziyaretçinin sadece bu etiketlerin oluşturduğu nesnelere klavyenin dikkatini çekme hakkı vardır. Bu nesnelerden biri tıklanınca Browser’ın focus’u bu nesneye dönmüş, yani “focus” olayı olmuş demektir; bu durumda, biz de bu olayı yönlendiren onFocus’u kullanabiliriz. Aynı mantıkla, ziyaretçi Browser’ın focus’unu bu nesneden başka bir yere çektiği zaman bu nesne focus’u kaybeder, “blur” (netlikten çıkma, flulaşma) olayı olur. Bunu da onBlur ile yönlendiririz.

Lütfen adınızı yazın ve sayfa üzerinde başka bir yeri tıklayın:

Şimdi de aşağıdaki kutuya mesleğinizi yazın:

Javascript, üstteki kutuya adınızı yazdıktan sonra başka bir yeri tıkladığınızda olan iş, “ad” isimli metin kutusunun “blur” olayına onBlur’ün çağırdığı goster() fonksiyonu ile; alttaki kutuyu mesleğinizi yazmak üzere tıkladığınız anda “meslek” kutusunda olan “focus” olayına da uyar() fonksiyonu ile karşılık veriyor.
onMouseOver, onMouseOut
Gerçekte bu iki olayla, Mouse işaretçisi bir bağlantı satırı veya grafiğinin ve bir grafik haritasının (Map, Area) üzerine geldiği veya üzerinden çekildiği zaman ilgilenebiliriz; çünkü diğer HTML unsurları ve Javascript nesneleri ile Mouse işaretçisinin işaretleme ilişkisi yoktur.
Bu olayı ve yönlendirilmesini, şu küçük programda görebiliriz:






PC World-Türkiye

Mouse işaretçisini PCWORLD-TÜRKİYE bağlantısının üzerine getirirseniz, Browser’ınızın alt çerçevesindeki statü mesajı yerinde "En güzel site için burayı tıklayın!", geri çektiğinizde de "En güzel siteye gitme fırsatını kaçırdınız!" mesajını göreceksiniz.
onLoad, onUnLoad
Javascript açısından Browser’ın bir HTML sayfasını görüntülemeyi bitirmesi sayfanın “load” (yükleme), başka bir sayfaya geçilmesi ise önceki sayfanın “unload” (yüklenmişlikten çıkması) sayılır; ve bu iki olayı onLoad ve onUnLoad yönlendiricileri ile karşılayabiliriz. HTML dosyasının iki bölüm (HEAD ve BODY) olduğunu biliyorsunuz. Browser açısından asıl sayfa, BODY bölümüdür; HEAD bölümündeki komutlar sayfanın nasıl görüntüleneceğine ilişkin komutlar içerir.
Bir sayfa Browser’a yüklenirken yapabileceğimiz bir çok işten birisi, ziyaretçinin Browser’ının türünü yoklamak olabilir.
var Browser=navigator.appName + " " + navigator.appVersion;
var getkey=Browser.substring(0, 12);
function hangiBrowser() {
if (Browser.substring(0, 8)=="Netscape")
window.location="netscape4.htm";
if (Browser.substring(0, 9)=="Microsoft")
window.location="ie.htm";
if ( (Browser.substring(0, 8)!="Netscape") && (Browser.substring(0, 9)!="Microsoft") )
window.location="belirsiz.htm";
}
Bu iki kodu içeren sayfanızı onLoad.htm adıyla kaydeder ve aynı dizine, içinde “Netscape kullanıyorsunuz! yazılı ve adı “netscape.htm”; içinde “IE kullanıyorsunuz!” yazılı ve adı “ie.htm”, ve içinde “Ne tür Browser kullandığınızı anlamadık!” yazılı ve adı “belirsiz.htm” olan üç HTML dosyası koyarsanız, onLoad.htm’i açmak istediğinizde kullandığınız Browser hangisi ise (onLoad.htm’in değil) diğer üç dosyadan birinin açıldığını göreceksiniz.



Bu sayfa size güle güle diyecek!!
Baska sayfa


Buradaki BODY etiketi, Browser başka sayfaya geçmek üzere mevcut sayfayı sildiği anda, Browser’a yeni bir pencere açarak, bu pencerede gulegule.htm’i görüntülemesini sağlayacaktır.
Olay Yakalama:
Bir butonun, resmin yada linkin click olayını yakalamak için etiketlere ait onClick olay yöneticisi kullanılır. Ayrıca tüm dokümandaki bir olaya belirleyeceğimiz bir fonksiyona da yönlendirebiliriz. Bunun için;
document.onClick=OlayKontrol; şeklinde bir atama ifadesi kullanılır.


..


Olay Parametreleri: Bir olay gerçekleştiğinde javascrit tarafından event adında bir nesne oluşturulur. Olayın türüne göre bu nesneden olay hakkında bilgi edinilebilir. Örneğin clik olayında Mouse koordinatları, shift tuşuna basılıp basılmadığı öğrenilebilir.

evet.clientX: pencereye göre X pozisyonu
event.clientY: pencereye göre Y pozisyonu
event.screenX: ekrana göre X pozisyonu
event.screenY: ekrana göre Y pozisyonu
event.button: Sol ise 1, sağ ise 2
event.shiftKey: Shift basılı ise 1
event.keyCode:hangi tuşa basıldığını verir.

Örnek:

Click somewhere in the document. An alert box will tell you if you pressed the shift key or not.

JAVASCRİPT NESNELERİ

Nesneler özellik ve metodlara sahiptir. Özellikler nesneyi tanımlayıp biçimlendirirken, metodlar ise nesnenin görevini ve işlevlerini yerine getirir. Nesnelerin kullanılması; özelliklerinin değiştirilmesi ve metotlarının çalıştırılması anlamına gelir.
Bir nesnenin özelliklerine erişmek için nesne adı ve özellik adı aralarına nokta koyularak belirtilir.
NesneAdı.ÖzellikAdı
Örneğin web sayfasının arka plan renginin bilgisini tutan document nesnesinin bgColor özelliğini değiştirebilirsiniz
document.bgColor=”yellow”;

Metotlara erişmenin yolu, özelliklere erişmekle aynıdır.
NesneAdı.MetotAdı(ParametreListesi)

Nesne Özelliklerinin Değiştirilmesi

---

Arka plan rengini değiştirmek için ilgili rengin butonuna basınız.























JavaScript nesneleri iki grupta toplanabilir. Tarayıcı ve HTML etiketleri tarafından, doküman tarayıcıya yüklendiğinde otomatik olarak oluşan document, window, form vb. nesneler. Diğeri ise JavaScript’te önceden tanımlanmış nesne tipleri (string ,Array vs.)
Önceden Tanımlanmış Nesneler: Bu grup nesneler tarayıcı ve tarayıcıya yüklenen dokümandan bağımsızdır. JavaScript tarafından genel amaçlı operasyonları yerine getirmek için önceden tanımlanmıştır. Matematik işlemleri, karakter işlemleri, tarih işlemleri, dizi işlemleri, veri tipi doğrulama ve veri dönüşümleri gibi temel işlemleri yerine getirirler.
• Array Nesnesi: Array nesnesi dizi değişkeni nesne gibi kullanılmasını sağlar.
Array Nesnesi Özellikleri:
Özellik Adı Tanımı
length Dizinin eleman sayısını verir.
prototype Dizi nesnesine yeni özellik ve metot ekler. Bütün nesnelerin ortak özelliğidir

Array Nesnesinin Metotları:
Metot Adı Tanımı
toString() Dizi elemanlarını arasına virgül koyarak string tipine dönüştürür.
Join (ayraç) Arasına ayraç ekleyerek dizi elemanlarını stringe dönüştürür.
Reverse() Dizi elemanlarını ters çevirir.
Sort() Dizi elemanlarını sıralar.









• String Nesnesi:
String Nesnesi Özellikleri:
Özellik Adı Tanımı
length Karakter katarının uzunluğunu bulur
prototype String nesnesine yeni özellik ve metot ekler. Bütün nesnelerin ortak özelliğidir


String Nesnesinin Metotları:
Metot Adı Tanımı
charAt(indeks) Belirtilen indeksdeki karakteri döndürür
fromCharCode(kod) Verilen UNICODE değerine ait karakteri döndürür.
indexOf(aranan) Karakter katarı içerisinde belirtilen alt diziyi arar ve bulduğu yeri döndürür. Bulamazsa -1 döndürür
split(ayraç) Karakter katarını belirtilen ayraca göre parçalayarak dizi nesnesi olarak geri döndürür.
substring(başlangıç,bitiş) Karakter katarını belirtilen indeks pozisyonları arasında keserek alt karakter dizisi olarak geriye döndürür.
toLowerCase() Bütün harflerini küçük harfe dönüştürür
toUpperCase() Bütün harflerini büyük harfe dönüştürür
valueOf() String nesnesinin tuttuğu değeri döndürür.
Substr(başlangıç,adet) Başlangıçtan itibaren adet tane kararkteri geriye döndürür



Çıkış:
HELLO
ABC

• Date Nesnesi: Tarih nesnesidir. Bilgisayarın tarih ve zaman bilgilerini almak için date nesnesi kullanılır. Date nesnesinin prototype dışında bir özelliği yoktur.
Date Nesnesinin Metotları: Tarih bilgisi almak için “get” atama yapmak için “set” le başlayan metotları vardır.getDate(), getTime(), getDay(), getHours(), getMilliSeconds(), getMinutes(), getMonth(), getSeconds(), getYear, metotları tarih bilgilerin almak için kullanılır. Aynı isimde “get” yerine “set” ifadesiyle atama yapan metotlar vardır.
• Math Nesnesi: Math nesnesi matematiksel işlemler için standart bir fonksiyon ve sabitler kütüphanesi sağlar.
Math Nesnesi Özellikleri:
Özellik Adı Tanımı
E Euler Sabiti
LN2 2 nin doğal logaritması
LN10 10 un doğal logaritması
LOG2E 2 tabanına göre E nin logaritması
LOG10E 10 tabanına göre E nin logaritması
PI PI Sabiti
SQRT2 2 nin karekökü

Math Nesnesi Metotları: Diğer programlama dillerine benzer olarak matematiksel metotlar mevcuttur.
abs(x), acos(x), cos(x), asin(x), sin(x), atan(2), ceil(x), flor(x), exp(x), log(x),pow(x,y), random(), round(x), sqrt(x)
JAVASCRIPT NESNELERI

Tarayıcı penceresine bir doküman yüklendiğinde, bir grup JavaScript nesnesi yaratılır. Bu nesneleri kullanarak tarayıcıyı ve yüklenen HTML dokümanını düzenleyebiliriz. Tarayıcı nesneleri hiyerarşik bir yapıya sahiptir. En dışta window nesnesi vardır. Diğer bütün nesneler “window” nesnesinin içerisinde bir alt nesne olarak yer alır.
Bir tarayıcı nesnesinin bir özellik veya metoduna erişmek istenirse bu hiyerarşik yapı kullanılır. Örneğin ekrana bir şey yazdırmak için;

document.write(“Ekrana Yazar”); çünkü write document nesnesinin metodudur.

Yeni bir penceredeki bir form elemanına erişmek için;
YeniPencereAdı.document.FormAdı.FormElemanAdı yapısı kullanılır.

• Navigator Nesnesi: navigator nesnesi tarayıcıya özel bir nesnedir ve taryıcının penceresi tarafından otomatik olarak yaratılır. Tarayıcının adı, sürümü ve üretici firma gibi tarayıcıya özel bilgileri bulundurur.

Navigator nesnesi özellikleri:

Özellik adı Veri tipi Tanımı
appName String Tarayıcının adı
appVersion String Tarayıcının versiyonu
appCodeName String Tarayıcının kod adı
mimeType Array Tarayıcının desteklediği dosya türlerini dizi olarak tutar
Plugins Array Tarayıcının desteklediği ek yazılımları dizi olarak tutar
userAgent String Tarayıcının tam olarak model bilgisini tutar.
userLanguage String İşletim sisteminin dilini verir.
browseLanguage String Browserın dilini verir
platform String İşletim sistemi türünü verir.

Navigator Nesnesi

---

• Window Nesnesi: En Üst seviyedeki tarayıcı nesnesidir. Tarayıcıya bir web sayfası yüklendiğinde otomatik olarak yaratılır. Tarayıcıda açılan her yeni pencere için “window” nesnesinin bir örneği yaratılır.

Özellikleri:

Özellik adı Veri tipi Tanımı
defaultStatus String Varsayılan durum çubuğundaki metni tutar
Frames Array Pencere içindeki tüm çerçeveleri oluşturulma sırasına göre indeksleyerek dizi nesnesi şeklinde tutar
Length Number Penceredeki çerçevelerin sayısını tutar
Name String Pencere yada çerçevenin adını tutar
Parent String Ana pencerenin adını tutar
Self String İçinde bulunulan aktif pencerenin adını tutar
Status String Durum çubuğundaki metni tutar
Top String En üst seviyedeki pencerenin adını tutar
Window String Aktif pencereyi tanımlamak için bir alternatif daha
location Object O an yüklü olan url hakkında bilgi verir.

Metotları:

Metot adı Tanımı
alert() Uyarı mesajı açar
close() Pencereyi kapat
confirm (mesaj) Onay kutusu
open ( url, isim, özellik) Verilen isimde yeni bir pencere açar ve url deki dokümanı yükler
prompt ( mesaj, örnek değer) Kullanıcıya veri giriş ekranı oluşturur.
Setimeout ( ifade zaman) Verilen zaman sonra verilen ifadeyi çalıştırır
cleartimeout(id) Settimeout metoduyla tanımlanan görevi iptal eder
Focus() Pencere aktif hale gelir
Blur() Pencere pasif hale gelir
Print() O anki pencere içeriği yazdırılır.
moveBy(x,y) Pencere pozisyonunu x, y kadar kaydırır.
moveTo(x,y) Pencere pozisyonunu x,y yapar
resizeBy(x,y) Pencere boyutunu x,y kadar değiştiri.
resizeTo(x,y) Pencere boyutunu x,y yapar
scrollBy(xnum,ynum) Belirtilen piksel kadar kaydırılır
scrolTo(xpos,ypos) Pelirtilen pozisyona sayfa kaydırılır

Open metodunun pencere özelliklerini tanımlayan özel sözcükleri:
Toolbar: Tarayıcının araç çubuğu
Menubar: Taratıcının menü çubuğu
Status: Durum çubuğu
Scrollbar : Kaydırma çubukları
Resizable : pencere boyutlarının değiştirilmesine izin verilir
Width : Piksel cinsinden pencerenin genişiliği
Height : Piksel cinsinden pencerenin yüksekliği
Location: web adresinin yazıldığı metin kutusu
Copyhistory: Yeni açılan pencereye eski pencerenin geçmiş (history) kaydının aktarılması

Örnek: Web adresinin yazıldığı metin kutusu ve araç çubuğuna sahip bir pencere açma:

win = window.open(“”,”test”,”location=1,toolbar=1”)

close (): İçinde bulunulan aktif pencereyi kapatmak için close() metodu kullanılır.
Başka bir pencereyi kapatmak için open metoduyla açılan pencere Win.Close() ifadesiyle kapatılır.

Pencere Aç/Kapama örneği:

Function YeniPencereAc()
{
pencere=window.open(“deneme.html”,”test”, “toolbar=1”);
}
function kapa(){
pencere.close();
}

Kullanıcıyla etkileşim:

Ziyaretçiden veri almak için “prompt” metodu kullanılır.
Prompt(“meaj”,”örnek deger”) şeklinde kullanılır

Örn: prompt(“Bir Sayı giriniz”,”5”)

Kullanıcıdan onay almak içinde confirm() metodu kullanır. Confirm metodu bir mesajla beraber “OK” ve “CANCEL” butonu sunarak kullanıcıdan onay alır.

Örnek:
Var Onay = confirm(“ Form bilgileri sunucuya gönderilecektir. Eminmisiniz?”)
if (onay) frm.gonder.submit;

setTimeout/clearTimeout:

SetTimeout metodu belli bir zaman sonra yerine getirilmesi gereken görevleri tanımlamak için kullanılır.
gorev_no = setTimeOut(ifade, zaman); zaman ms cinsinden 1000 ms = 1sn

clearTimeout metodu da setTimeout metoduyla tanımlanan görevi iptal eder.

clearTimeout(gorev_no)

Örnek : reklam penceresi açma/kapama

var id;
function reklampenceresi_ac(url,zaman)
{
win=open(url,"reklampenceresi","scrollbar=no,width=250,height=200");
id = setTimeout("win.close()",zaman);
}
function gorev_iptal()
{
id = clearTimeout(id);
}



Örnek : kayan yazı



• Screen Nesnesi: Screen nesnesi istemcinin görüntleme ekranı hakkında bilgi taşır. İstemci ekran çözünürlüğü renk derinliği gibi bilgiler screen nesnesi ile öğrenilebilir.
Özellikleri

Özellik adı Veri tipi Tanımı
Screen.heigth number Ekran yüksekliği
Screen.width number Ekran genişiliğ
Screen.colorDepth Number Renk derinliği

Örnek:






• Document Nesnesi: Document nesnesi window nesnesinin en büyük ve en önemli alt nesnesidir. Document nesnesi tarayıcının penceresinde yüklü olan web dokümanını yani web sayfasını temsil eder. Yüklü olan web dokümanı üzerindeki HTML etiketlerine erişmeyi ve düzenleme yapabilmeyi sağlar. HTML’in etiketi dokümana eklendiğinde document nesnesi de tanımlanmış olur.
Özellikleri:
Özellik adı Veri tipi Tanımı
linkColor String Ziyaret edilmemiş linklerin rengi belirler
vlinkColor String Ziyaret edilmiş linklerin rengini belirler
alinkColor String Aktif linkerin rengini belirler
Anchors[] Array Doküman içindeki tüm çapaları oluşturulma sırasına göre indeksleyerek dizi nesnesi şeklinde tutar
Forms[] Array Doküman içindeki tüm formları oluşturulma sırasına göre indeksleyerek dizi nesnesi şeklinde tutar
İmages[] Array Doküman içindeki tüm resimleri oluşturulma sırasına göre indeksleyerek dizi nesnesi şeklinde tutar
Links[] Array Doküman içindeki tüm linkleri oluşturulma sırasına göre indeksleyerek dizi nesnesi şeklinde tutar
bgColor String Dokümanın araka plan vergini belirler
fgColor String Sayfadaki metinlerin rengini belirler
lastModified String Dokümanın en son değiştirilme zamanını verir
Location String Yüklü olan dokümanın url adresini belirler
Referrer String Yüklü olan dokümana hangi url adresinden gelindiğini verir
Title String Yüklü olan dokümanın başlığını belirler
Document Nesnesi Metotları:

Metot adı Tanımı
clear() Yüklü olan dokümanı temizler
close() Open metoduyla açılan dokümanı kapatır
open() Write metoduyla yazmak için doküman aralığı açar
write() Dokümana metin vaya kod yazar
writeln() Dokümana metin veya kod yazar
getElementById() Belirtilen Id ye sahip ilk nesneyi geri döndürür
GetElementsByName() Belirtilen isme sahip nesne kümesini geri döndürür.
getElementsByTagName() Belirtilen tag ismine sahip nesne kümesini geri döndürür.

Örnek: Open metodu






Örnek: getElementsByTagName














value="How many input elements?" />



Nesnelere erişim: Nesnelere erişim hiyerarşik bir yapıda gerçekleştirilir. Document nesnesinin içindeki Logo isimli resmin ;

Document.Logo.src ( kaynağına erişim)
Document.Logo.width (genişliğine erişim )
Document.Logo.height (yüksekliğine erişim)

Resmin ismi yerine images nesnesi kullanılarak da istenilen resme erişilebilir. İmages nesnesi resimleri bir dizi şeklinde tutar.

Document.images[0].src (0. resme erişim) // oluşturulma sırasına göre sıralıdır.
Document.images[1].src (1. resme erişim)

Örnek : Araka plan rengini değiştiren uygulama

document.bgClor=’red’; ifadesi ile sayfanın araka plan rengi değitirilir.

• History Nesnesi: History nesnesi ziyaret edilen linkleri diske kayıt ederek ileri geri hareket edilmesini sağlar
Özellikleri:
Özellik adı Veri tipi Tanımı
Length Integer History nesnesinin kaydettiği geçmişte ziyaret edilmiş linklerin sayısını belirtir.
Current String Tarayıcının penceresinde yüklü olan dokümanın url adresini belirtir.
Next String Geçmiş listesindeki bir sonraki url adresini belirtir.
Previous String Geçmiş listesindeki bir önceki url adresini belirtir.
Metotlar:

Metot adı Tanımı
back() Geri butonunun işlevini yerine getirir
forward() İleri butonunun işlevini yerine getirir
go(x) X ile belirtilen kadar ileri veya geri

History.back() // bir önceki sayfaya git
History.go(-1) // bir önceki sayfaya git
History.forward() // bir sonraki sayfaya git
History.go(1) // 1 önceki sayfaya git

• location Nesnesi: location nesnesi kullanıcının penceresine yeni doküman yüklemek için kullanılır. Herhangi bir anda veya bir olay sonucu verilen adrese yönlendirmeyi sağlar. Location nesnesinin anahtar özelliği “href” özelliğidir. Bu özellik yeni yüklenecek olan dokümanın url adresini belirtir

location.href=”yeni.html” // pencereye yeni.html dokümanını yükle
location.href=”http://www.ktu.edu.tr”.
• Frame Nesnesi: etiketinin yer aldığı çerçeve yapısını içeren doküman yüklenir yüklenmez tarayıcı otomatik olarak frame nesnesini yaratır. Aslında frame nesnesi window nesnesinin bir alt nesnesidir. Fakat window nesnesi gibi davranır. Window nesnesine ait özellik ve metotların hemen hemen tamamına sahiptir.
Farme nesnesine erişmek için iki yol vardır; birincisi etiketinin name özelliği ile belirtilen ismi kullanarak:

parent.cerceve1, parent.cerceve2
diğer yöntem ise;
parent.frames[0] , parent.frames[1] şeklinde bloğunda yazılış sırasına göre belirtilir.
Çerçeve nesnelerine erişmek için parent dışında top ve self adında iki özel sözcük daha kullanılır.
o top: En üst seviyedeki pencereyi ifade eder.
o parent: bir çerçevenin içinde bulunduğu ana çerçeve parent sözğüyle adlandırılır.
o self: çerçevenin kendisidir.

çerçeve 1

Bilkent Üniversitesi


Hacettepe Üniversitesi


• Form Nesnesi

Formlar kullanıcı ile sunucu makine arasında interaktif bir ara yüz sağlar. JavaScript kullanarak birçok şeyi kullanıcının makinesinde, yani istemcide çözmek formları daha iyi bir etkileşim aracı haline getirir.

Özellikleri:

Özellik adı Veri tipi Tanımı
action String Form sunucuya gönderildiğinde sunucuda hangi url adresi tarafından karşılanacağını belirtir.
method String Forma girilen bilgilerin ne şekilde sunucuya taşınacağını belirtir. GET veya post metodu kullanılır
name String Formun tanımlanan adıdır
length String Formda bulunan elemanların sayısını verir
elements Array Formda yer alan tüm elemanları indeksleyerek dizi nesnesi şeklinde tutar


Metotları:

Metot adı Tanımı
Submit() Formu sunucuya gönderir
Reset() Formu ilk yüklenildiğindeki varsayılan duruma getirir


document.Forms[0];// 0. formu ifade eder
document.frm1; // frm1 isimli formu ifade eder;

frm.elements[0].value; form içindeki 1. elemanın değerini ifade eder
frm.adi.value; form içindeki adi isimli nesnenin değerini ifade eder

frm.submit() // formu gönderir
frm.reset() // formu başlangıç durumuna getirir


Örnek : Form nesneleriniü :

if (document.frm1.pswd.value == "")
{
alert("sifre girmelisiniz");
document.frm1.pswd.focus();
}
else if (document.frm1.pswd.value!=document.frm1.onay.value)
{
alert("sifrenizi tekrar yazın");
document.frm1.onay.value="";
document.frm1.pswd.value="";
document.frm1.pswd.focus();
}
else document.frm1.submit(); // formu gönder



Örn: Karakter limiti örneği




Form Elemanları:

etiketiyle oluşturulan formlar içerisinde aşağıdaki tabloda belirtilen elemanlar bulunabilir.

Eleman Adı Nesne Etiket Tanım
Metin Kutusu text INPUT
Metin Alanı textarea TEXTAREA
Radyo Butonları radio INPUT
Seçme Kutusu select INPUT Checkbox
Gizli Alanlar hidden INPUT
Şifre Alanı password INPUT
Seçim Menüsü select SELECT
Butonlar Submit,reset,button INPUT

Text Nesnesi: ifadesiyle oluşturulan text nesnesinin;

Özellikleri:
Özellik adı Veri tipi Tanımı
defautValue String Metin kutusunun ilk değerini belirtir. Bu değer kullanıcının girdiği değil tasarımcının etiketini tanımlarken value özelliğine atadığı ilk değerdir.
Value String Metin kutusunun güncel değerini tutar
name String Metin kutusunun adını tutar

Metotları:
Metot adı Tanımı
focus() Fare imlecinin istenilen metin kutusu üzerine odaklanmasını sağlar.
blur() Focus() metodunun tam tersi işlem yapar
select() Metin kutusu içeriğinin seçilmesini sağlar
Textarea Nesnesi: ... ifadesiyşe oluşturulan Textarea nesnesi Text nesnesi ile aynı özellik ve metotlara sahiptir.

Radio Nesnesi: ifadesiyle oluşturulan Radio butonları kullanıcıya birden fazla şık sunarak sadece birinin seçilmesine olanak sağlar.

Özellik adı Veri tipi Tanımı
Checked Mantıksal Radio butonunun seçili olup olmadığını belirtir
Document.araba.MARKA[0].checked=true
defaultChecked Mantıksal Tasarım sırasındaki seçim durumunu belirtir.
name String Radio butonunun adını tutar
length Integer Radio butonu grubu içinde kaç tane radio butonu olduğunu belirtir.
value String Radio nesnesinin sahip olduğu değeri tutar
Document.araba.MARKA[0].value
Metotları:
Metot adı Tanımı
Click() Gruptaki istenilen radio butonunu seçmek için kullanılır. Kullanıcının radio butonuna tıklamasını taklit eder. Aynı işlev checked özelliğine true değeri atayarak da yapılabilir.
Document.araba.MARKA[0].click()
Document.araba.MARKA[0].checked()=true

checkbox Nesnesi: ifadesiyle oluşturulan checkbox nesnesi Radio butonlarına çok benzer aralarındaki fark: Seçme kutuları kendi başlarına çalışır böylece birden fazla seçim yapılmasına izin verir.

• checkbox nesnesiyle radio nesnesinin özellikleri ve metotları aynıdır.
Örnek:
Var mesaj=”Çaldığını enstrumanlar:\n”;
Var enstrumanlar=””;
For (i=0;i{
if (document.enstruman.elements[i].type=”checkbox”)
if (document.enstruman.elements[i].checked)
enstrumanlar + = document.enstruman.elements[i].value+”\n”;
}
if (enstrumanlar==””) enstrumanlar=”YOK”;
alert(enstrumanlar);
password Nesnesi: ifadesiyle oluşturulan password nesnesi şifre alanlarını oluşturmak için kullanılır. Text nesnesiyle aynı özellik ve metotlara sahiptir. Tek farkı kullanıcının girdiği karakterler “*” karakteriyle gösterilir.

Hidden Nesnesi: ifadesiyle oluşturulan hidden nesnesi form üzerinde gizli bir text nesnesi oluşturur. Hidden nesnesinin name ve value özellikleri vardır. Genel sunucuya görünmesi gerekmeyen bilgiyi göndermek için kullanılır.

Select Nesnesi: Dar bir alanda kullanıcıya seçim listesi sunar. Seçim listesi hazırlamak için etiketi kullanılır.

...
...
...


Select nesnesinin özellikleri:
Özellik adı Veri tipi Tanımı
length Integer Seçim menüsünde kaç tane liste elemanı olduğunu belirtir.
Name String Seçim menüsünün adıdır.
selectedIndex Integer O anda seçili olan seçim listesindeki elemanın index numarasını döndürür. etiketiyle oluşturulan seçim listesi yazılış sırasına göre indexlenir.
multiple Bu bir işarettir değer almaz. CTRL tuşu ile birden fazla seçim yapılabileceği anlamına gelir.
options Array Seçim listesinin oluşturduğu dizi nesnesidir.select nesnesi üzerinde çalışmak için option dizi nesnesinin ayrıca özellikleri vardır.

Optıon Dizi Nesnesinin Özellikleri
Özellik adı Veri tipi Tanımı
length Integer Seçim menüsünde kaç tane liste elemanı olduğunu belirtir.
selected mantıksal Liste elemanının seçili olup olmadığını belirtir
defaultSelected mantıksal Liste elemanlarının ilk seçili durumunu belirtir.
selectedIndex mantıksal Seçim menüsünde o anda seçili olan liste elemanının index numarasını döndürür.
text string Belirtilen liste elemanının ekranda kullanıcıya gösterilen metin değeridir.
value String Verilen liste elemanının değerini belirtir.
index Number Verilen liste elemanının index numarasını verir.











































CSS (Cascading Style Sheets)

Web sayfalarının sunumunda esneklik ve kontrolü arttırmak CSS in temel görevidir. CSS ile HTML etiketleri renk, font, sınır çizgileri ve daha birçok açıdan kontrol edilebilir.Bu özellik kişiye özel renk ve fontlarla düzenlenmiş daha canlı web sayfaları yapmaya olanak sağlar. HTML, CSS ve JavaScript dillerinin birleşmesi sonucu DHTML (Dinamik HTML) oluşur.
Web sayfalarındaki metinleri formatlarken genellikle HTML etiketleri kullanılır. Örneğin sitenizdeki web sayfalarında yer alan tüm başlıkları

etiketiyle kırmızı ve Arial font kullanarak yazılmasını istiyorsunuz. Bunun için

Başlık

ifadesi kullanılabilir.Bu ifadenin iki tane dezavantajı vardır.
• HTML dokümanın yapısını tanımlamak için kullanılmalıdır. Doküman ve dokümandaki stilleri tanımlamak için uygun değildir. Örneğin sitenizdeki tüm web sayfalarına yukarıdaki başlık formatını ekledikten sonra rengin kırmızı değil de yeşil olmasına kara verdiğinizi düşünelim. Bu durumda tüm etiketlerinin color özelliğini değiştirmek gerekir.
• Bazı formatlama efektleri HTML ile yapılamaz örneğin çizgi boşlukları, sınırlar ve metin gölgeleri gibi.
Sonuç olarak yukarıdaki başlık yapısını CSS kullanarak oluşturmak çok daha akılcıdır.

başlığını istediğimiz özellikte formatlayan CSS yapısı:

H3 { font-family: Arial; color:red }

Eğer rengi yeşile dönüştürmek istersek yapmamız gereken tek şey CSS tanımındaki color özelliğini değiştirmek olacaktır. Böylece tüm başlıklar değişecektir. Böylece zaman kaybı önlenecek, hatalar en aza indirilecek ve modüler bir yapı oluşturulacaktır.

SÖZDİZİM KURALLARI:
Tipik bir stil ifadesi bir seçim ve tanımlamalarından oluşur. Her tanımlama bir grup özellik ve değerlerini içerir. Bunlar seçici adından sonra küme parantezleri içinde yer alır {}. Örneğin

paragraf etiketine ait metinler için Arial font tanımlamak istnirse:
P { font-family: Arial} ifadesi kullanılır.
Yukarıdaki ifadede P bir seçici, font-family bir stil özelliğidir. Birden fazla özellik tanımlamak için özellik:değer ikilileri arasına ; koyulur. Örneğin

paragraf etiketine ait metinler için Arial font ve kırmızı renk tanımlamak için :
P {font-family:Arial; color:Red} ifadesi kullanılır.
Bir seçici 3 şekilde tanımlanır:
1. HTML etiketi ile: Bir HTML etiketine ait genel bir format belirtmek için kullanılır. İfadeden sonraki tüm ilgili HTML etiketleri belirtilen formatta gösterilir.
H2 {font-family:Arial; color:Red}
BODY { font-family:Arial}
2. HTML Etiketi ve Sınıf Adıyla: Bir HTML etiketine ait stil ifadesi sınıflandırılabilir. Yani bir HTML etiketi için birden fazla formatlama sınıfı oluşturulabilir. Bunun için seçici HTML etiketi adından sonra bir nokta (.) ve sınıf adı verilir.
P.soru { color:Red}
P.cevap { color:Gren}
Burada soru ve cevap metinleri için farklı renk formatlarına sahip birer sınıf oluşturuldu. Bu grup seçiciler HTML etiketlerini doğrudan formatlamaz. HTML etiketinin kodunu yazarken class özelliğiyle hangi hangi sınıfın kullanılacağı belirtilmelidir.

Soru Başlığı

Cevap Başlığı

3. Bağımsız Sınıf Adıyla: Bir HTML etiketine bağlı olmayan özel sınıflarda yaratılabilir. Bunlar genelde birden fazla HTML etiketi için oluşturulan sınıfladır. Seçici bir nokta ile (.) ile başlayan sınıf adından oluşur.
.baslik { font-family:Arial; color:Red}

.başlık sınıf adıyla oluşturulan yukarıdaki ifade genel bir sınıf tanımıdır. Uygun tüm HTML etiketleri ile kullanılabilir. Bu grup stil ifadeleri yine class özelliğiyle belirtilir.

…

…

…

HTML İÇİNDE CSS KULLAMI:
CSS kodları HTML dokümanları içinde iç farklı şekilde yerleştirilir.
• etiketleri arasındaki blokta tanımlanır. STYLE bloğu HEAD bloğu içinde yer almalıdır.
...

HTML etiketinin bloğu içinde kullanılabilir çünkü @import bir HTML etiketi değildir.
...

...

CSS ÖZELLİKLERİ
CSS in 56 farklı özelliği vardır. Bunlar beş kategoride toplanabilir.
• Font özellikleri
• Renk özellikleri
• Liste Özellikleri
• Metin yerleşim özellikleri
• Kenar boşluğu ve Sınır özellikleri

Font Özellikleri: Font özellikleri en fazla kullanılan özelliklerden birisidir.
• Font-family: Font ismi tanımlamayı sağlar.
Font-family:Arial
• Font-size: Fontun boyutunu tanımlamayı sağlar.
Font-size:11pt
• Font-style: fontun yazı stilini tanımlamayı sağlar. Çoğunlukla eğik yazı stili tanımlamak için kullanılır.
Font-style:italic
• Font-weight: yazının koyuluk seviyesini ayarlamak için kullanılır.
Font-weight:bold
Bold değeri dışında normal, bolder ve light değerleri de kullanılır. İstenirse özel bir koyuluk değeri de verilebilir. Bunun için 100-900 arasında bir değer girilir. 400 sayısı normal değerine 700 sayısı da bold değerine karşılık gelir.
Font-weight:600
• Text-decoration: metine bazı özel efektler vermek için kullanılır. Alabileceği değerler:
Line-through: yazının üzeri çizili
Overline: yazının üstü çizili
Underline: yazının altı çizili
None: yazıda herhangi bir çizgi olmaz




Renk ve Arka Alan Özellikleri: HTML de renkler iki farklı şekilde tanımlanabilir. Temel renkler rengin İngilizce adıyla tanımlanır. Ara renklerse rengin RHB kodunun 16’lık tabandaki karşılığı ile tanımlanır.
• Color: metin renkleri gibi HTML’in önalan renklerini belirlemeyi sağlar.
kırmızı
leylak rengi

• Background-color: HTML elemanlarının arka plan rengini belirlemeyi sağlar.
BODY { font-family:Times New Roman; color:#191970;
Backgroun-color:#fffafa }

Bir input nesnesinin arkaplan rengini beya dışında bir renk yapmak istersek;

INPUT { font-family: Courier New; Background-color:silver }

• Background-image: HTML elemanlarının arka plan resmi belirlemeyi sağlar.

CSS MENU

---

Ana Menu

JavaScript

Freewarejava.com

Download.com

PHP.net (Turkey)

DİNAMİK HTML:
HTML, CSS ve JavaScript dillerinin birleşmesi sonucu DHTML (Dinamik HTML) oluşur. HTML’in CSS ve JavaScript’le yaptığı işbirliği sonucu oluşan bir uygulama teknolojisidir. Bir HTML dokümanında JavaScript ve CSS kodlarının olması o dokümanın DHTML kullandığı anlamına gelmez. CSS ve JavaScript’in etkileşimli olarak kullanılması gerekir. CSS kullanılarak HTML etiketlerine ilk pozisyon ve görünüm özellikleri yüklenir. Daha sonra sayfa yeniden yüklenmeden JavaScript’le bu özellikler dinamik olarak değiştirilebilir.
DHTML yapılarının ençok kullanıldığı uygulamalar; gelişmiş menüler, kayan yazılar ve linkler, etkileşimli animasyonlar, hareketli sunumlar, katmanlar, fare imlecine duyarlı animasyonlar, grafikli oyunlar, sürükle-brakuygulamalarıdır.

• Nesne Konumlandırma:Dokümandaki bir nesnenin konumunu belirlemek için CSS özellikleri kullanılır. JavaScriptle bu stil özellikleri değiştirilerek dinamik konumlandırma yapılır. Bu stil özellikleri left, top ve position’dır. Left ve top sol ve üst kenardan olan uzaklığını belirtir. Postion ise pozisyonun nasıl belirleneceğini belirler. Üç farklı değer alır: absolute, relative ve static. Varsayılan değeri static dir.
Absolute (Mutlak konumlandırma): Pozisyonun dokümandaki diğer nesnelerden bağımsız olarak pencerenin sol ve üst kenarlarına göre yapılmasıdır.

....

Biligi PAYLAŞ mak içindir.

Static (Statik Konumlandırma): position özelliğinin varsayılan değeridir. Tarayıcı tarafından dokümana yerleştirilme sırasına göre varsayılan pozisyona yerleştirir. Static konumlamada top ve left özelliği tanımlanamaz ve daha sonra değiştirilemez.

• Nesne Kaydırma: Bir nesnenin position özelliği absolute veya relative olarak belirlendiyse nesnenin doküman içindeki konumu değiştirebilirsiniz. Bunu yapma oldukça basittir. Sadece nesnenin top ve left değerlerini değiştirmek yeterlidir.
Örnek:


















Nesne Gösterme ve Gizleme: Dokümandaki nesneler kullanıcıların haraketlerine göre gizlenebilir yada tekrar görünür yapılabilir. Bunun için nesnenin visibility özelliği kullanılır. Gizlemek için visible, gizlemek için hidden değerini alır.

Katmanların Gorunurluk kontrolu

---

Katmanı gizlemek için asagıdaki butona basın!

Renk Değiştirme: Dinamik renk değiştirmek oldukça basittir. CSS’in renk belirleyen background-color ve color gibi özellikleri JavaScript yardımıyla değiştirilebilir. CSS de çift kelimeden oluşan özellik adları (-) ile ayrılır. CSS özelliklerine JavaScript’le erişirken özellik adı biraz değişikliğe uğrar. Tire ayracı kalkar ve ikinci kelimenin baş harfi büyük olacak şekilde birleşik yazılır

Arka Alan

R
G
B



On Alan

R
G
B






Dinamik İçerik: HTML nesneleri içeriklerini value özelliğidinde tutarlar. Yani JavaScript ile bir nesnenin içeriğinin değiştirilmesi value özelliğini güncelleyerek yapılır.

Başvuru Formu

İsim
Telefon
Adres
E_Posta

Fare İmlecinin Yerini belirlemek: HTML dokümanında gerçekleşen her olay bir evnt nesnesi yaratır. Bu nesne olayla ilgili bazı bilgiler barındırır. Bu biligilerden birisi clientX ve clientY kullanıcının tarayıcısına göre olayın gerçekleştiği koordinatı verir. screenx ve screenY ise tarayıcının ekranına göre koordinatı verir.

Fare İşaretcisinin yerini Bulma

---

Tarayıcının Penceresine Göre Koordinat

X
Y

Bilgisayar Ekranına Göre Koordinat

X
Y



Katmanlar: Katman, HTML’e, kendi içindeki bütün unsurların bir bütün olarak ele alınmasını bildirir. Tabir yerinde ise, DIV veya LAYER etiketi ile oluşturacağınız katman ile HTML sayfasının üzerine, altını gösteren bir kat koymuş oluyorsunuz. CSS tekniklerini kullanarak Layer unsurlarını sayfada diğer herhangi bir HTML unsurundan daha büyük ölçüde ve çok daha hassas şekilde biçimlendirebilir; hatta hareket özelliği kazandırabilirsiniz. Katman oluşturmak için tarayıcılar ortak olarak

etiketini kullanır.
Katman nesnesinin birçok CSS özellikleri vardır. Bunların bir çoğu diğer HTML nesneleri içinde kullanılır. Katmanlar üzerinde kullanabilieceğimiz özellikler aşağıdaki tabloda yer almaktadır.

Özellik Adı Açıklama
position Katmana nasıl pozisyon verileceğini belirler
left Katmanın sol sınırının orjine olan uzaklığı
top Katmanın sağ sınırının orjine olan uzaklığı
height Katmanın yüksekliğini verir.
width Katmanın genişliğini verir.
visibility Katmanın görünürlüğünü kontrol eder
z-index 3. Boyut değeridir. Üst üste yığılan katmanların sırasını belirler
overflow Katmanın kendisi için ayrılmış alanın dışına çıkması durumunu belirler.Dört farklı değer alır: visible,hidden,auto ve scroll
clip Katmanın görünür kısmını sınırlamak için kullanılır
clip:rect(a,b,c,d) şeklinde bir dikdörtgen belirtilebilir.

Katmanların Gorunurluk kontrolu

---

Katmanı gizlemek için asagıdaki butona basın!