SELECTING IN JQUERY AND BASIC ANIMATION EĞİTİMİ

jQuery ile seçim ve animasyon ustalığı

jQuery seçicileri, DOM gezinme ve manipülasyon ile akıcı efekt ve temel animasyonlar geliştirin

Selecting in jQuery and Basic Animation Eğitimi, jQuery ile öğe seçimini ve temel animasyonları uygulamalı öğretir. Program jQuery kurulumu, CSS tabanlı seçiciler, özellik ve sözde seçiciler ile filtrelerle başlar; DOM gezinme, içerik ve öznitelik manipülasyo…

3 gün Orta Seviye Online / Yüz Yüze / Hibrit Sertifikalı

Eğitim Hakkında

jQuery seçicilerinden DOM gezinme ve manipülasyona, efektlerden animate ile özel animasyonlara

Selecting in jQuery and Basic Animation Eğitimi, jQuery ile öğe seçimini ve temel animasyonları uygulamalı öğretir. Katılımcılar CSS tabanlı seçicileri, özellik ve sözde seçicileri, filtreleri kullanır; DOM ağacında gezinir ve öğeleri manipüle eder. show, hide, fadeIn, slideDown gibi efektleri uygular; animate ile özel animasyon yazar, kuyruk, easing ve geri çağrı ile akıcı etkileşimler kurar.

Süre ve Format

3 Gün. Her gün dört modül; jQuery seçicilerinden DOM manipülasyonu ve animasyonlara kadar her konu canlı sayfa örnekleriyle uygulanır.

Seviye

Orta Seviye — jQuery seçicileri, DOM gezinme ve manipülasyon ile temel efekt ve animasyonlar

Öğrenme Metodu

Her konu canlı sayfa örnekleriyle işlenir; seçiciler, manipülasyon ve animasyonlar gerçek etkileşim senaryolarında uygulanarak pekiştirilir.

Neden Bu Eğitim?

🎯Hızlı seçim

jQuery'nin güçlü seçicileriyle sayfadaki öğelere hızlı ve okunabilir biçimde erişip tek satırda işlem yapmayı öğrenirsiniz.

✨Akıcı animasyon

Hazır efektler ve animate ile sayfaya akıcı, dikkat çeken ve kullanıcı deneyimini güçlendiren animasyonlar eklemeyi öğrenirsiniz.

🔧Pratik DOM

DOM gezinme ve manipülasyonla içeriği, sınıfları ve stilleri dinamik değiştirerek sayfaları etkileşimli hale getirmeyi öğrenirsiniz.

Anahtar Konular

jquery eğitimijquery seçiciler eğitimijquery animasyon eğitimijquery dom manipülasyonjquery kursujquery efektler eğitimijquery animate kullanımıön yüz geliştirme eğitimiweb animasyon eğitimijquery olay yönetimi
“İyi bir etkileşim fark ettirmeden akar; jQuery ile seçim ve animasyona hakimiyet, sayfalara canlılık katmanın en pratik yoludur.”

Ön Koşullar

Eğitimden verim almak için faydalı olacak bilgi ve kurulum gereksinimleri

1
HTML ve CSS bilgisi

Temel HTML yapısı ve CSS seçicilerine aşinalık; jQuery seçicileri bu temelin üzerine kurulur.

2
Temel JavaScript

Değişken, fonksiyon ve olay kavramlarına aşinalık; jQuery söz dizimi ve geri çağrılar eğitimde işlenir.

3
Kod editörü

VS Code gibi bir editör ve modern bir tarayıcı; örnekler canlı sayfalar üzerinde denenir.

4
jQuery kurulumu

CDN veya yerel dosyayla jQuery eklenen bir sayfa; kurulum ilk modülde adım adım gösterilir.

Eğitim İçeriği

Programın gün gün akışı aşağıdadır. Bir güne tıklayarak o günün modüllerini ve içeriklerini görebilirsiniz.

Günün hedefiKatılımcı jQuery'yi sayfaya ekler, CSS tabanlı seçicileri, özellik ve sözde seçicileri kavrar, filtrelerle öğe kümesini daraltmayı uygular.
Modül 1
jQuery Kurulumu ve $
  • CDN ve yerel dosyayla jQuery ekleme
  • $ fonksiyonu ve jQuery nesnesi
  • document ready ile güvenli başlatma
  • noConflict ile kütüphane çakışması önleme
  • jQuery sürümleri ve slim yapı farkı
  • Tarayıcı konsolunda ilk seçim denemesi
Modül 2
Temel Seçiciler (Basic)
  • Etiket, sınıf ve id seçicileri
  • Birden çok seçiciyi birleştirme
  • Alt öğe ve torun (descendant) seçimi
  • Doğrudan çocuk (>) seçici kullanımı
  • Komşu ve kardeş (sibling) seçicileri
  • Seçim sonucunun jQuery kümesi olması
Modül 3
Özellik Seçicileri
  • [attr] ile özellik varlığı seçimi
  • [attr=value] ile tam değer eşleşmesi
  • Başlangıç, bitiş ve içerme eşleşmesi
  • data-* özniteliklerine göre seçim
  • Birden çok özellik koşulu ile seçim
  • Form öğelerini özellikle seçme
Modül 4
Filtreler ve Sözde Seçiciler
  • :first, :last ve :eq() filtreleri
  • :even, :odd ile sıra tabanlı seçim
  • :visible ve :hidden durum filtreleri
  • :contains() ile metne göre seçim
  • Form filtreleri: :checked, :selected
  • .filter() ve .not() ile daraltma
Günün hedefiKatılımcı DOM ağacında gezinir, öğeleri ve metni manipüle eder, sınıf ve öznitelikleri değiştirir, olayları bağlayarak sayfayı etkileşimli kılar.
Modül 1
DOM Ağacında Gezinme
  • parent, parents ve closest ile yukarı
  • children ve find ile aşağı gezinme
  • next, prev ve siblings ile kardeşler
  • first, last ve eq ile konuma erişim
  • each ile küme üzerinde dolaşma
  • Zincirleme (chaining) ile akıcı kod
Modül 2
İçerik Manipülasyonu
  • text ve html ile içerik okuma/yazma
  • val ile form değeri alma ve atama
  • append ve prepend ile öğe ekleme
  • before, after ile konumlu ekleme
  • remove ve empty ile öğe ve içerik silme
  • clone ile öğe kopyalama (klonlama)
Modül 3
Öznitelik, Sınıf ve Stil
  • attr ve removeAttr ile öznitelik yönetimi
  • prop ile boolean özellik yönetimi
  • addClass, removeClass ve toggleClass
  • hasClass ile sınıf varlığı kontrolü
  • css ile satır içi stil değiştirme
  • data ile veri saklama ve okuma
Modül 4
Olay (Event) Yönetimi
  • on() metodu ile olay dinleyici bağlama
  • click, hover ve submit olayları
  • Olay delegasyonu (delegated events)
  • event nesnesi ve preventDefault
  • off() ile olay dinleyici kaldırma
  • Olay ile seçim ve animasyonu birleştirme
Günün hedefiKatılımcı show, hide, fade ve slide efektlerini uygular; animate ile özel animasyon yazar, kuyruk, easing ve geri çağrılarla akıcı etkileşimler kurar.
Modül 1
Göster/Gizle Efektleri
  • show, hide ve toggle ile görünürlük
  • Süre (duration) parametresi ile hız
  • fadeIn, fadeOut ile saydamlık efekti
  • fadeToggle ve fadeTo kullanımı
  • slideDown, slideUp ile kaydırma
  • slideToggle ile aç/kapat davranışı
Modül 2
Özel Animasyonlar (animate)
  • animate ile CSS özelliklerini canlandırma
  • Genişlik, yükseklik ve opaklık animasyonu
  • Göreli değerlerle (+=, -=) animasyon
  • Birden çok özelliği birlikte canlandırma
  • Süre ve hız seçeneklerinin ayarı
  • Renk animasyonu ve sınırlamalar
Modül 3
Kuyruk ve Zamanlama
  • Animasyon kuyruğu (queue) mantığı
  • Zincirleme animasyonların sıralanması
  • delay ile animasyon geciktirme
  • stop ile çalışan animasyonu durdurma
  • finish ve clearQueue kullanımı
  • Eşzamanlı ve sıralı animasyon farkı
Modül 4
Easing, Geri Çağrı ve Uygulama
  • Easing (linear, swing) ile hız eğrisi
  • Tamamlanınca geri çağrı (callback)
  • Geri çağrı ile animasyon zincirleme
  • Açılır menü ve akordeon örneği
  • Yumuşak kaydırma (smooth scroll) efekti
  • Seçici, olay ve animasyonla mini proje

Eğitim Kazanımları

Program sonunda katılımcılar:

✅
Seçici hakimiyeti

CSS tabanlı seçiciler, özellik seçicileri ve sözde seçicilerle sayfadaki öğelere hızlı ve doğru erişirsiniz.

✅
Filtreleme

:first, :eq, :visible ve .filter gibi filtrelerle seçim kümesini daraltıp istediğiniz öğeleri hedeflersiniz.

✅
DOM gezinme

parent, children, siblings ve find ile DOM ağacında gezinir, zincirleme ile akıcı ve okunabilir kod yazarsınız.

✅
İçerik manipülasyonu

text, html, val, append ve remove ile içeriği dinamik olarak okur, ekler, günceller ve silersiniz.

✅
Stil ve sınıf

addClass, toggleClass ve css ile sınıf ve stilleri değiştirir, attr ve prop ile öznitelikleri yönetirsiniz.

✅
Olay yönetimi

on ile olayları bağlar, delegasyonu kullanır ve seçim ile animasyonu olaylara bağlayarak etkileşim kurarsınız.

✅
Hazır efektler

show, hide, fadeIn ve slideDown gibi efektlerle öğeleri akıcı biçimde gösterir ve gizlersiniz.

✅
Özel animasyon

animate ile CSS özelliklerini canlandırır, kuyruk, easing ve geri çağrılarla akıcı etkileşimler oluşturursunuz.

Kimler İçin Uygundur?

  • Web sayfalarına etkileşim ve animasyon eklemek isteyen ön yüz geliştiriciler
  • jQuery kullanan projeleri sürdüren yazılımcılar
  • DOM manipülasyonunu pratikleştirmek isteyen web tasarımcıları için uygundur

Sıkça Sorulan Sorular

Bu eğitim kimler için uygundur?
Web sayfalarına etkileşim ve animasyon eklemek isteyen ön yüz geliştiriciler, jQuery kullanan projeleri sürdüren yazılımcılar ve DOM manipülasyonunu pratikleştirmek isteyen web tasarımcıları için uygundur. Temel HTML, CSS ve JavaScript aşinalığı beklenir; jQuery söz dizimi sıfırdan işlenir.
Hangi seçiciler öğretiliyor?
CSS tabanlı etiket, sınıf ve id seçicileri, alt öğe, çocuk ve kardeş seçicileri; [attr], [attr=value] gibi özellik seçicileri; :first, :eq, :even, :visible, :contains, :checked gibi filtre ve sözde seçiciler ile .filter() ve .not() işlenir. Seçimin güçlü ve okunabilir kullanımı hedeflenir.
Hangi animasyonlar kapsanıyor?
show, hide, toggle gibi görünürlük efektleri; fadeIn, fadeOut, fadeTo saydamlık efektleri; slideDown, slideUp, slideToggle kaydırma efektleri ve animate ile özel CSS animasyonları işlenir. Ayrıca kuyruk (queue), delay, stop, easing ve geri çağrı (callback) ile akıcı etkileşim kurulur.
Eğitimin süresi ve formatı nedir?
Eğitim üç gün sürer ve her gün dört modülden oluşur. Her konu canlı sayfa örnekleriyle işlenir ve son gün seçici, olay ve animasyon birleştirilerek açılır menü, akordeon gibi mini bir proje geliştirilir. Yüz yüze veya online yapılabilir; içerik kurumun ihtiyacına göre uyarlanır.
Eğitim sonunda sertifika veriliyor mu?
Programı tamamlayan katılımcılar Digital Vizyon Akademi Katılım ve Başarı Sertifikası alır. Sertifika tamamlanan modülleri ve geliştirilen etkileşimli sayfa örneğini belgeler; kurumsal gruplara özel proje ve içerik uyarlamasıyla genişletilebilir.

Sertifikalandırma

Bu eğitim Digital Vizyon Akademi Başarı Sertifikası ile tamamlanır.

Eğitim başında “Ön Test”, bitiminde “Son Test” uygulanarak gelişim ölçümlenir. Değerlendirme formunu dolduran katılımcılar sertifikalarını alır. Sertifikanızın geçerliliğini Sertifika Sorgulama sayfasından doğrulayabilirsiniz.

Örnek Sertifika d Digital Vizyon AKADEMİ KATILIM SERTİFİKASI Bu sertifika [Katılımcı Adı Soyadı] adlı katılımcının aşağıdaki eğitim programını başarıyla tamamladığını belgeler. Selecting in jQuery and Basic Animation Eğitimi Sertifika Kodu DV-2026XX00 Tarih 15.10.2026 Yetkili İmza DV AKADEMİ

Eğitim Bilgileri

Süre3 gün
SeviyeOrta Seviye
FormatOnline / Yüz Yüze / Hibrit
Sertifika✓ Var
Hemen Bilgi Al
İlgili Eğitimler

Bu Eğitimle Birlikte Tercih Edilenler

JavaScript ve TypeScriptWorking with ASK API Using Node.js & Java Eğitimi
Web ve Ön Yüz Geliştirme Eğitimleri

Working with ASK API Using Node.js & Java Eğitimi

3 günOrtaOnline / Yüz Yüze / Hibrit

Alexa Skills Kit (ASK) API ile Node.js ve Java kullanarak sesli beceri geliştirme: intent, slot, SSML, oturum yönetimi ve Lambda dağıtımı kurumsal eğitimi.

Detayları Gör →
JavaScript ve TypeScriptWorking with Jasmine Spies & Using Jasmine with Node.js Eğitimi
Web ve Ön Yüz Geliştirme Eğitimleri

Working with Jasmine Spies & Using Jasmine with Node.js Eğitimi

4 günOrtaOnline / Yüz Yüze / Hibrit

Jasmine ile BDD testleri: spyOn ve createSpy ile spy stratejileri, matcher'lar, Node.js kurulumu, asenkron test ve CI entegrasyonu içeren kurumsal eğitim.

Detayları Gör →
JavaScript ve TypeScriptWorking with JSON, Java, Node.js, & Python Eğitimi
Web ve Ön Yüz Geliştirme Eğitimleri

Working with JSON, Java, Node.js, & Python Eğitimi

4 günOrtaOnline / Yüz Yüze / Hibrit

JSON'ı Java, Node.js ve Python ile işleyin: JSON Schema doğrulama, Jackson, Gson, json modülü ve pydantic ile uçtan uca JSON eğitimi.

Detayları Gör →
JavaScript ve TypeScriptES ve Modern JavaScript Özellikleri Eğitimi
Web ve Ön Yüz Geliştirme Eğitimleri

ES ve Modern JavaScript Özellikleri Eğitimi

4 günOrtaOnline / Yüz Yüze / Hibrit

ES6+ let/const, ok fonksiyonları, destructuring, Promise, async/await, modüller, optional chaining ve Proxy ile modern JavaScript eğitimi.

Detayları Gör →
JavaScript ve TypeScriptİleri Seviye JavaScript Geliştirme Eğitimi
Web ve Ön Yüz Geliştirme Eğitimleri

İleri Seviye JavaScript Geliştirme Eğitimi

4 günİleriOnline / Yüz Yüze / Hibrit

Kapanışlar, prototipler, olay döngüsü, async/await, Proxy ile metaprogramlama, performans ve test ile ileri seviye JavaScript geliştirme eğitimi.

Detayları Gör →
JavaScript ve TypeScriptJavaScript Development with Microservices Eğitimi
Web ve Ön Yüz Geliştirme Eğitimleri

JavaScript Development with Microservices Eğitimi

4 günOrtaOnline / Yüz Yüze / Hibrit

Node.js ile mikroservis mimarisi, REST ve gRPC, mesaj kuyrukları, dayanıklılık desenleri, Docker ve Kubernetes dağıtımını öğreten uygulamalı eğitim.

Detayları Gör →
+90 (501) 369 40 14 WhatsApp [email protected] LinkedIn