jquery image preview

jQuery: Upload Edilmeden Resim önizleme

jQuery ile gelen nimetlerden birini daha bugün inceleyelim. Form kullanarak upload edeceğimiz görsel dosyaları sunucuya yollamadan önce preview (önizleme) jQuery kodları ile mümkün. Kullanılabilirlik ve kolaylık için ziyaretçilerinize sunabilirsiniz.  Formun file element değeri her değiştiğinde çalışan bu kod bloğu seçilen resimin local adresini ele alarak sayfada gösteriyor. Demo uygulamanın kodları da bu mantık kadar basit[…]

jQuery Autocomplete

jQuery:Ajax: AutoComplete Uygulaması

Türkçesi otomatik tanımlama ve/ya tamamlama olan bu uygulama web 2.0 furyasından sonra Ajax teknolojisi ile beraber kullanılabilirlik ve erişilebilirlik açısından büyük bir yenilik getirdi. Kullanıcılara projeniz içinde daha hızlı ve verimli arama yapabilmelerine imkan tanımak için uygun bir autocomplete uygulaması kullanmanız gerekir. Kullanıcıların, sayfaları tek tek gezmeden, aradığını bulduktan sonra detaylarını inceleyebildiği için, hem proje[…]

HTML5 Geolocation

HTML5 Geolocation Uygulaması

 HTML5 teknolojisi ile gelen Geolocation  özelliği, tarayıcıdan alınan kullanıcı izni ile, konum tesbiti ve konumu artık çok basit. GeoLocation API güvenilir web siteleri ile konumunuzu paylaşmanızı sağlar. Tarayıcınız konum belirleme desteklemiyor ise, mobil cihazınızda GPS ünitesi var ise, Firefox’un eski sürümleri için Firefox’un en yeni sürümü veya bir geolocation  addon kullanabilirsiniz. navigator.geolocation.getCurrentPosition(showPosition); Yukarıdaki kod betiğinde yer alan getCurrentPosition[…]

google sıra bulucu

PHP: AJAX: Google Sıra Bulucu – Position Finder

Websitenizin, google aramalarında hangi anahtar kelimenin kaçıncı sırada çıktığını öğrenmek için, sade bir uygulama demosu geliştirelim.   Google Api kaynağı ile CURL metodu ile web search sistemini çalıştırıp, JSON formatında dönen listeyi;  istenen domainin kaçıncı sırada bulunduğunu bulmak için kullanacağız. Öncelikle, api ve sorgular için kullanacağımız, GPositionFinder class (sınıf)’ı ve ajax ile bağlantı kurulan  post.php dosyasını[…]

tweet listeleme

jQuery: Tweet Listeleme Uygulaması

2012’nin son makalesi niyetine,  twitter kullanıcıların tweetlerini listeleyen sade ve basit bir uygulama hazırladım. Kullanıcı adını arayarak kullanıcının public tweetlerini listeleyen bu araçta, jQuery kütüphanesi ve herzamanki gibi serpito.com demo arayüzünü HTML + CSS  altyapısı olarak kullanıyorum.

jQuery Uygulaması

jQuery Form Post

Serpito arşivini kurcalarken, jQuery kütüphanesini kullanarak ajax form örneklerini hiç paylaşmadığımızı farkettim. Geç de olsa bu açığı kapatmaya çalışalım.   Özellikle sayfalarda kullanıcı yorumları veya mesajlarını iletebilmek için kullanılan formlar ,  jQuery kullanarak pratik bir şekilde Ajax ile çalıştırılabilmektedir. 

jQuery Sortable

PHP:jQuery Sortable Sürükle – Sırala

Bu kez, jQuery UI kullanarak Data sıralama uygulaması yapıyoruz.  jQuery UI Dragable ve Sortable metodları ile sürüklenerek sıralanabilir basit bir uygulamanın kodlarını paylaşıyorum. Ajax ile sıralamanın etkilerini database verilerini güncellemek mümkün. Geçelim Kodlara; 

Ajax Select Chained İl ilçe semt mahalle

PHP:jQuery: Chained Select – İl & İlçe & Semt & Mahalle Seçimi

Yazının daha önceki versiyonunda Ajax ile dinamik şehir ve ilçe seçimi yapmıştık.  Ziyaretçilerden gelen talep üzerine, bu versiyonda  Şehir > İlçe > Semt > Mahalle seçimi sistemini paylaşıyorum.   Sistemin kodları aşağı yukarı benzer olmasına rağmen, yine de baştan sonra tüm kodları paylaşmak daha mantıklı geldi. Buyrun kodlara geçelim;

Ajax Select Chained İl ilçe semt mahalle

PHP:AJAX:jQuery: Chained Select – İl & İlçe Seçimi

Web geliştiriciler için küçük ama kafa ağrıtan bu uygulamayı kısaca paketleyip demo atmak istedim.  Lazım olduğunda bakmak üzere elimizin altında dursun. Ajax methoduyla dinamik il ilçe seçimi için öncelikle Türkiye İl ve İlçe veritabanına ihtiyacımız var (Uygulama için hazırladığım download paketinde bulabilirsiniz).

Yeni Başlayanlar İçin jQuery – Bölüm 2

jQuery’de Olaylar Önceki bölümde de belirttiğim gibi, javascript olay temelinde çalışır. Bir işlemin yapılası için bir olay gerçekleşmeli. jQuery’de tanımlı olaylardan bazıları; click(): Bir elemana tıklanma olayı mouseOver(): Fare üstüne gelme olayı moseOut(): Fare üstünden ayrılma olayı toggle(): 2 tık. Fare bir tıklayınca 1., ikinci tıklayışında da 2. fonksiyonu çalıştırır. change(): Bir “select box” nesnesindeki,[…]