Yapay zekadan makale özeti
- Kısa
- Ayrıntılı
- Bu video, Bulut Izer tarafından sunulan bir eğitim içeriğidir. Bulut Izer, kodlasak.com'dan bir eğitimci olarak jQuery animate ve toggle fonksiyonlarını anlatmaktadır.
- Videoda, jQuery animate ve toggle fonksiyonlarının nasıl kullanılacağı adım adım gösterilmektedir. Eğitmen, bir buton ve bir resim kullanarak, butona basıldığında resmin büyümesi ve kenar çizgisinin kırmızı renk alması, ardından tekrar eski haline dönmesi gibi basit bir örnek oluşturur. Video boyunca HTML, CSS ve JavaScript kodları yazarak, jQuery fonksiyonlarının nasıl uygulanacağını detaylı şekilde açıklar.
- 00:01jQuery Animate ve Toggle Fonksiyonları Tanıtımı
- Videoda jQuery, animate ve toggle fonksiyonları kullanılarak basit bir örnek yapılacaktır.
- Örnek, buton ve dilim kullanılarak jQuery kodlarının nasıl çalışacağını göstermektedir.
- Kaynak kodları videonun altında paylaşılacaktır.
- 00:39Gerekli Kütüphaneler ve HTML Kodları
- jQuery 1.7.2 min adlı JavaScript dosyası indirilmelidir.
- Örnekte bir buton ve bir dilim olacak, butona basıldığında jQuery kodlarının değişiklikleri görülecektir.
- HTML kodları yazılırken div'e id ve resim genişliği atanmaktadır.
- 02:14CSS Kodlaması
- Buton için kenar ovalliği, padding değerleri ve genişlik ayarları yapılmaktadır.
- Resim için ripple efekti uygulanarak tekrar etmesi engellenmektedir.
- Resmin boyutu 851x202 piksel, yüksekliği 35 piksel olarak ayarlanmaktadır.
- 06:04jQuery Kodlarının Yazılması
- Butona basıldığında div'in büyümesi için toggle fonksiyonu kullanılmaktadır.
- Butona basıldığında resmin büyümesi, kenar çizgisinin kırmızı renk alması ve orijinal boyutlarına dönmesi sağlanmaktadır.
- Butona tekrar basıldığında resmin eski haline dönmesi için animate fonksiyonu kullanılmaktadır.
- 10:49Ek Özellikler ve Kapanış
- Resmin başlangıçta 1, küçültüldüğünde 0,40 değerine sahip olması için ek özellikler eklenmektedir.
- Videoda jQuery, animate ve toggle fonksiyonlarının nasıl kullanılacağı gösterilmiştir.
- Kodlasak.com'dan Bulut İzer tarafından sunulan bu videoda anlatılamayan konular için özür dilemektedir.