Sınıf nasıl geçiş yapılır

JavaScript kullanarak elementlerde sınıfları eklemek ve silmek arasında geçiş yapma.

Düğmeyi tıklayarak sınıf adını değiştirebilirsiniz!

sınıf geçiş yapma

Birinci adım - HTML ekleyin:

sınıfı eklemek için id="myDIV" div elementleri arasında geçiş yapma (bu örnekte, sınıf adını değiştirmek için düğmeyi kullanıyoruz).

<button onclick="myFunction()">Deneyin</button>
<div id="myDIV">
  Bu bir DIV elementidir.
</div>

İkinci adım - CSS ekleyin:

geçiş yapmak için bir sınıf adı ekleyin:

.mystyle {
  width: 100%;
  padding: 25px;
  background-color: coral;
  color: white;
  font-size: 25px;
}

Üçüncü adım - JavaScript ekleyin:

almak id="myDIV" nin <div> elementi, ve "mystyle" sınıflar arasında geçiş yapma:

function myFunction() {
  var element = document.getElementById("myDIV");
  element.classList.toggle("mystyle");
}

kendinizin deneyin

ilgili sayfalar

dersnasıl sınıf eklenir

dersnasıl sınıf silinir

Referans el kitabı:HTML DOM Element classList özelliği