Eyl.06

Eyl.06

Hızlandırılmış jQuery 3 Dersleri : Animate (Animasyon)

Daha önceki konularımızda jQuery’de .css() metodunu kullanarak elementlere yeni stiller atamayı veya var olanı değiştirmeyi görmüştük. .animate() metodu da .css() metoduna benzer, ancak yeni atanan stilleri geçiş efekti olarak uygular. Mesela bir img etiketinin genişliği 100px iken, .animate() metodu ile 200px olarak değiştirilirse, direkt 200 olmak yerine 100’den 200’e artan bir değerle genişleyerek ilerleyecektir.

jQuery

Eyl.06

Hızlandırılmış jQuery 3 Dersleri : Effects (Efektler)

jQuery ile bir takım basit efektleri kolaylıkla hazırlayabiliyoruz. Mesela bir elementin görünmez veya görünür yapılması, bunları yaparken solma efektlerinin uygulanması veya çeşitli kayma efektleri basitçe oluşturulabilir. Ayrıca CSS değişikliği yaparken bile bunun animasyonlu bir şekilde yapabilirsiniz. Şimdi bunları uygulamalarla görelim…

jQuery

Eyl.06

Hızlandırılmış jQuery 3 Dersleri : Attributes (Özellikler) ve Styles (Stiller)

HTML5’te hemen hemen her bir elementin mutlaka bir özelliği, yani attribute’u olmalıdır. Mesela aşağıdaki kodu ele alalım…

<h1 class=”baslik” >Merhaba</h1>

Bu kodumuzda bir adet class attribute’u yer almaktadır. Ayrıca etiketler arasında yer alan “Merhaba” yazısı da bir özellik ifade etmektedir.

Şimdi jQuery ile class özelliğini değiştirecek, yeni class değerleri ekleyecek ve elementin içeriğini değiştireceğiz. Yazacağımız kodlar, yukarıda yer alan örnek kod satırı referans alınarak yapılacak.

jQuery

Eyl.06

Hızlandırılmış jQuery 3 Dersleri : Selectors (Seçiciler)

CSS’te yer alan selector mantığını aynısı jQuery’de de vardır. Hedeflenen elementi veya elementleri belirlemek için elementin ismi, elementin class ismini, elementin id ismini veya biraz daha kompleks bir yapı olan elementin herhangi bir attribute değerinde belli bir string içeren elementleri de çoklu olarak seçebiliriz.

Seçicileri işlemek amacıyla aşağıdaki gibi bir HTML5 sayfası hazırlayalım. Seçim işlemini yaptığımız elementlerin de yazı rengini değiştireceğiz.

jQuery