W3.JS Gizle ve Göster


w3.hide(selector)

Öğe Kimliğini Kullanarak Öğeleri Gizleme

Belirtilen kimliğe sahip bir öğeyi gizlemek için, kimlik adının önüne bir karma etiketi (#) kullanın.

id="Londra" ile bir öğeyi gizleyin:

Örnek

<button onclick="w3.hide('#London')">Hide</button>


Etiket Adı Kullanarak Öğeleri Gizleme

Belirtilen etiket adına sahip tüm öğeleri gizlemek için seçici olarak etiket adını (< ve > olmadan) kullanın.

Tüm <h2> öğelerini gizle:

Örnek

<button onclick="w3.hide('h2')">Hide</button>


Sınıf Adı Kullanarak Öğeleri Gizleme

Belirtilen sınıf adına sahip tüm öğeleri gizlemek için sınıf adının önüne nokta (.) koyun.

class="city" ile öğeleri gizle:

Örnek

<button onclick="w3.hide('.city')">Hide</button>


Öğe Kimliğini Kullanarak Öğeleri Göster

Belirtilen kimliğe sahip bir öğeyi göstermek için, kimlik adının önüne bir karma etiket (#) kullanın.

id="Londra" ile bir öğe göster:

Örnek

<button onclick="w3.show('#London')">Show</button>


Etiket Adını Kullanan Öğeleri Göster

Belirtilen etiket adına sahip tüm öğeleri göstermek için seçici olarak etiket adını (< ve > olmadan) kullanın.

Tüm <h2> öğelerini göster:

Örnek

<button onclick="w3.show('h2')">Show</button>


Sınıf Adını Kullanan Öğeleri Göster

Belirtilen sınıf adına sahip tüm öğeleri göstermek için sınıf adının önüne nokta (.) koyun.

Öğeleri class="city" ile göster:

Örnek

<button onclick="w3.show('.city')">Show</button>

Gizle/Göster arasında geçiş yap

w3.toggleShow(selector)

Öğe Kimliğini Kullanarak Gizle ve Göster arasında geçiş yapın

id="London" ile bir öğeyi gizleme ve gösterme arasında geçiş yapın:

Örnek

<button onclick="w3.toggleShow('#London')">Toggle Hide/Show</button>


Etiket Adını Kullanarak Gizle ve Göster arasında geçiş yapın

Tüm <h2> öğelerini gizleme ve gösterme arasında geçiş yapın:

Örnek

<button onclick="w3.toggleShow('h2')">Toggle Hide/Show</button>


Sınıf Adını Kullanarak Gizle ve Göster arasında geçiş yapın

class="city" ile öğeleri gizleme ve gösterme arasında geçiş yapın:

Örnek

<button onclick="w3.toggleShow('.city')">Toggle Hide/Show</button>