Çözüldü JavaScript ile CSS animasyonu çalıştırma

Bu konu çözüldü olarak işaretlenmiştir. Çözülmediğini düşünüyorsanız konuyu rapor edebilirsiniz.
William Crusader

William Crusader

Hectopat
Katılım
11 Kasım 2020
Mesajlar
5.371
Makaleler
1
Çözümler
14
Daha fazla  
Cinsiyet
Erkek
Meslek
Yok
Bir element için CSS üzerinde animasyon hazırladım. Bunu JavaScript üzerinde çalıştırmam lazım (bir fonksiyon kuracağım.). Bunu nasıl yaparım?
 
Çözüm
Ecmel
JS tarafında butona tıklanınca class verdirmek mantıklı geldi bana.

Öncelikle o butona bir tane id verelim. Bu id "test" olsun. O butona onclick'te fonksiyonun adını veriniz. Ben mesela animasyon olarak verdim.

JavaScript: 
function animasyon() {document.getElementById('test').className = 'animasyonlu-btn';}

Fonksiyonumuz bu şekilde olacak. Burada "animasyonlu-btn" adlı bir class veriyoruz butona tıklanınca.

CSS: 
.animasyonlu-btn {
  animation:onethatgetbigger 5s;
  animation-fill-mode: forwards;
}

Buradaki "onethatgetbigger" verdiğin animasyonun adı, yanındaki de kaç saniye süreceği değeri.

Bu şekilde sorunun çözülecektir. :)
Tarihe göre sırala Puana göre sırala
@William Crusader Bugüne kadar hiç böyle bir kullanım görmedim, varsa da ben bilmiyorum. Her zaman ayrı ayrı verdim ki öyle olması gerektiğini biliyorum. Senin şeklinde kullanan bir tane proje görmedim ki HTML yapısına çok uyan bir kullanım değil. Eğer varsa da böyle bir kullanım kaynağını atarsan incelerim.
 
Artı 0 Eksi

Benzer konular

0
  • Çözüldü
Çözüldü  JavaScript ile radio button'a tıklanınca CSS değiştirme
2
Mesaj
17
Görüntüleme
3.550
01yildizmustafa
0
J
  • Soru
JavaScript  HTML CSS ve JavaScript ile zar oyunu yapılıyor fakat çalışmıyor
Mesaj
4
Görüntüleme
573
Merlin Ambrosius
Merlin Ambrosius
SkyGrass
HTML, CSS, Bootstrap ve JavaScript ile site oluşturulabilir mi?
2
Mesaj
11
Görüntüleme
2.421
sonrisa
sonrisa
F710Kolu
JavaScript ile HTML uyarısı gösterme
Mesaj
3
Görüntüleme
1.012
429106
4
Fueren
HTML, CSS ve JavaScript nasıl geliştirilebilir?
Mesaj
4
Görüntüleme
302
938945
9

Technopat Haberler

Yeni konular

Yeni mesajlar

Geri
Yukarı