Toplam 1 adet sonuctan sayfa basi 1 ile 1 arasi kadar sonuc gösteriliyor
-
05.Ocak.2015, 23:35 #1
JavaScript - Kayan Logo Çalışması Nasıl Yapılır?
DHtml öğrenmek için uğraşıldığında javascript nesnelerinin ve bu nesnelerin özelliklerinin kullanılmasının öğrenilmesi önemlidir. Bu nedenle değişik alıştırmalar yaparak nesneler üzerinde çalışılması gerekmektedir. Bu yazımızda window nesnesi nin iki özelliğini öğreneceğiz ve bu iki özellikten birtanesini kullanarak kayan logo scriptini birlikte hazırlayacağız. dHtml çalışması olduğundan bu işlemi yaparken browserler arasındaki farkları da göreceğiz.
Script ne yapacak?
Hazırlayacağımız script sayfa üzerine yerleştirilen bir logoyu sayfa kaydırma çubukları kullanılarak hareket ettirildiğin de sayfa üzerinde hep aynı konumda kalmasını sağlayacak ve böylece logo devamlı olarak sayfa içerisinde görüntülenecek. Aslında bir çok uygulamada kullanabileceğiniz bu scripti ayrıca ekranda devamlı olarak görüntülenmesini istediğiniz bir menü için de kullanabilirsiniz.
Nasıl çalışıyor?
Sayfa içerisinde bir katman tanımlayarak bu katman içerisine logomuzu yerleştiriyoruz. Sonrada sayfanın en üst noktasını devamlı olarak denetliyoruz. Eğer sayfa kaydırılırsa sayfanın en üst noktasının değeri değiştiriliyor ve bizde orantılı olarak hazırladığımız katmanın konumunu değiştiriyoruz. Bu şekilde katman sayfa aşağı kaydırıldığında katmanda aşağıya doğru kaydırılıyor, eğer sayfa yukarıya doğru kaydırılırsa katmanda yukarıya doğru kaydırılıyor.
Sayfanın en üst noktasını bulmak için ise window nesnesinin özelliklerinde yararlanıyoruz. Window nesnesi kullanılarak sayfanın en üst noktasının değerini ve en sol noktasının değerini bulabiliriz.
Window nesnesinin bazı özellikleri
Window nesnesinin bir çok özelliğinden ikisi bize sayfanın görünen en üst noktasını bildiren pageYOffset ( İnternet Explorer için ise body.scrollTop ), ve sayfanın görünen en sol noktasını bildiren pageXOffset ( IE için body.scrollLeft ) özellikleridir. Bu özellikler sayfanın görünen noktaları üzerinde çalışır. Aslında sayfanın başlangıç değerleri 0, 0 dır. Fakat ekranda görünen ilk noktalar sayfa kaydırıldığında değişir. Bu özeklikleri nasıl kullandığımızı görelim. İlk olarak Netscape için :
Kod:
en_ust_nokta = window.pageYOffset;
en_sol_nokta = window.pageXOffset;
Bu ifadeler ile sayfanın görünen en sol ve en üst noktalarının değerini elde ediyoruz. Aynı işlemi IE için ise :
Kod:
en_ust_nokta = document.body.scrollTop;
en_sol_nokta = document.body.scrollLeft;
yukarıdaki şekilde bir ifade kullanarak elde ediyoruz.
Konu Bilgileri
Bu Konuya Gözatan Kullanıcılar
Şu anda 1 kullanıcı bu konuyu görüntülüyor. (0 kayıtlı ve 1 misafir)
Benzer Konular
-
Logo Nedir? İyi Bir Logo Nasıl Olmalıdır?
Konu Sahibi deniz Forum Grafik - Tasarım DersleriCevap: 1Son Mesaj : 09.Mayıs.2022, 18:54 -
Javascript İle Sayfadaki Elemanlara Nasıl Hükmedersiniz?
Konu Sahibi optimusprime Forum MySQLCevap: 0Son Mesaj : 10.Aralık.2014, 20:54 -
Logo Nasıl Tasarlanır? (Videolu Anlatım)
Konu Sahibi optimusprime Forum Grafik - Tasarım DersleriCevap: 0Son Mesaj : 04.Aralık.2014, 07:44 -
Logo Nedir? İyi Bir Logo Nasıl Olmalıdır?
Konu Sahibi deniz Forum Grafik - Tasarım DersleriCevap: 0Son Mesaj : 01.Ağustos.2014, 12:59 -
Ücretli Logo Yapılır
Konu Sahibi WeBMasteR Forum PhotoshopCevap: 0Son Mesaj : 08.Haziran.2014, 17:00
Shopsocks5 - Service Socks5 Cheap...
28.Mayıs.2024, 14:40 in Güvenlik