Ekim 13, 2011 at 21:58 · Kategori: Jquery
Uzun soluklu tempolu çalışmalar sebebiyle son zamanlarda biraz yorgun düştüğümü itiraf etmeliyim. Öğrendiklerimi paylaşmaya çok vakit bulamıyor olsam da, kısaca yazabileceklerimi paylaşmaya çalışacağım. Bunlardan biri de sayfadaki herhangi bir elemana scroll işlemi gerçekleştirmek olacak.
Projemizdeki senaryoda submit edilen form içerisinde, validasyondan geçemeyen ilk elamanın yanında bir validasyon tooltipi gösteriyoruz. (Bu alan boş bırakılamaz, E-posta adresi geçersiz vb.) Uzun formlarda validasyon mesajı mevcut browser pencere içerisinde sayfada görünemeyebiliyordu. Bu sebeple eğer ilgili tooltip sayfada görünmüyorsa o elemana doğru pürüzsüz bir kaydırma işlemi gerçekleştirdim. Bunu yaparken de jquery’in animation methodundan ve window’un scrollTop property’sinden yararlandım.
Basitçe syntax
$("html, body").animate({ scrollTop: $("Scroll-Edilecek-Element").offset().top }, "slow");
Kullanımına örnek vermek adına, sayfanın en altında sabit bağlantılar olduğunu ve bunların belli bloklara işaret ettiğini varsayalım. Mevcut bağlantılara tıklanıldığın sahip oldukları class’lar gözönünde bulundurularak ilgili bloklara scroll işlemi gerçekleştirelim.
Örnek uygulama için buraya tıklayınız…
Ekim 10, 2011 at 23:24 · Kategori: Genel
Bir projede ihtiyaç doğrultusunda regexlerde değişiklik yapmamız gerekiyordu. Ben de daha önce regex’le ilgilenmiştim ancak itiraf etmeliyim ki bu süreçte çok kullanmadığım için çabucak unutmuşum. Kısaca yeniden bir gözden geçirdim ve yeni öğrendiğim bir tekniği paylaşmak istedim.
Proje aşağıdaki gibi urllere sahip, fontunu kalınlaştırdığım kısım ise bizim regex ile elde etmemiz gereken kısım.
http://localhost/index.php/page,Testing.EditProfile/PageId,trabhsw32sadsaxe32sadas1
İki parçada sorunu şu şekilde çözdüm. Sizin de farklı bir çözümüz varsa paylaşabilirsiniz.
(?<=\.)([a-zA-Z]+){4}
1) İlk kısımda noktaya kadar olan kısmı urlden çıkarmasını istedim. Bu şekilde http://localhost/index. kısmından url’i arındırmış olduk.
2) Amacımız slash’ın hemen öncesindeki eşleşen kelimeyi almak aslında. Bu durumunda php kısmından da bir şekilde kurtulmamız gerekiyor. Php 3 karakter içerdiğinden ve aynı zamanda sayfa isimlerin de asgari 4 karakter olduğu senaryomuzda 2. kısım için a’dan z’ye büyük ve küçük harf duyarlı olmak üzere en az 4 karakter zorunluluğu koydum. Bu şekilde istediğim kısmı, projedeki tüm url çeşitlerinde elde etmiş oldum.
Bu örneği uygularken öğrendiğim en önemli nokta ise benim için yazdığım regex’in ilk kısmıydı. Bu kullanım şeklinin diğer versiyonlarını kendime de bir hatırlatma olsun diye ayrıca buraya not alıyorum.
1) (?=ABC)
Positive lookahead. Matches a group after your main expression without including it in the result.
2) (?!ABC)
Negative lookahead. Specifies a group that can not match after your main expression (ie. if it matches, the result is discarded).
3) (?<=ABC)
Positive lookbehind. Matches a group before your main expression without including it in the result.
4) (?<!ABC)
Negative lookbehind. Specifies a group that can not match before your main expression (ie. if it matches, the result is discarded).
İyi çalışmalar,
Test için yararlandığım siteye buradan ulaşabilirsiniz.
Ekim 9, 2011 at 09:48 · Kategori: JavaScript
Javascript’de bazen bir işlemi belli aralıklarla tekrar tekrar yapmamız gerekir. Bunun için de genelde setInterval methodu tercih edilir.
Her 2 saniyede bir sayfadaki bir panel içerisinde bilgilerin veritabanı sorgusu yapılarak güncellenmesini istebiliriz. Ancak gözden kaçırabileceğimiz durum, çalışan fonksiyon 2 saniye içerisinde tamamlanamayabilir. Bu durumunda setInterval işlem bitmeden aynı fonksiyonu ikinci kez çalıştıracaktır. Böyle bir senaryoyu engellemek için javascriptin kendini çağıran fonksiyon yapısını setTimeout ile kullanmak daha mantıklı olabilir.
(function(value){
alert(value);
setTimeout(arguments.callee,2000);
})("61")
Kullanım şeklinin rahat anlaşılması için örneği basit tuttum. Burada alert yerine uzun bir işlem sürecine sahip bir yapı düşenebilirsiniz.
İyi çalışmalar,
