Pomoc:Zwijanie

Zwijanie jest opcją do pokazywania (lub ukrywania) elementów HTML.

Kiedy strona zawiera wiele powiązanych ze sobą elementów, które sprawiają, że strona ta jest ​​bardzo długa, można użyć zwijania, funkcja ta pozwala redaktorom na skrócenie strony i umożliwienie czytelnikom na rozwinięcie obszarów, które ich interesują. Podobnie do spisu treści, inne elementy wiki mogą być zaprojektowane do zwijania.

Aby stworzyć zwijany element, wystarczy dodać do niego klasę mw-collapsible.

Przykłady

Zwijanie tabeli

Dodając mw-collapsible jako klasę, można zwinąć tabelę oszczędzając miejsce.

{| class="wikitable mw-collapsible"
! Numer !! Litera
|-
| 1 || A
|-
| 2 || B
|-
| 3 || C
|}

Zwijanie tekstu

Możliwe jest również zwijanie tekstu w artykułach, skutecznie skracając stronę i pozwalając czytelnikowi zdecydować, czy chce przeczytać resztę informacji.

<div class="mw-collapsible">
Ten tekst jest zwijany.
</div>

Zaawansowane ustawienia

Stan początkowy

Aby ustawić stan początkowy dla zwijanego elementu można się posłużyć klasą mw-collapsed oraz mw-collapsible, przykład można ujrzeć poniżej:

{| class="mw-collapsible mw-collapsed wikitable"
! Nagłówek || pozostaje widoczny
|-
| Ta zawartość || jest ukryta
|-
| podczas || pierwszego ładowania
|}

Wybieranie zawartości zwijania

Można również określić, która część zawartości może być zwijana używając mw-collapsible-content.

<div class="mw-collapsible mw-collapsed" style="width:100%">
Ten tekst nie jest zwijany; ale następny jest zwijany i ukryty domyślnie:
<p class="mw-collapsible-content">Ten tekst powinien być ukryty domyślnie.</p>
Ten tekst powinien być również widoczny
</div>

Niestandardowe nazwy

Nie lubisz Rozwiń/Zwiń w linkach? Nie ma problemu! Zmień to używając data-expandtext i data-collapsetext. Jeśli potrzebujesz bardziej kompaktowego linku, możesz również używać symboli

{| class="wikitable mw-collapsible" data-expandtext="Illuminati" data-collapsetext="Deluminati"
!Mój || Nagłówek
|-
| A || B
|-
| C || D
|}

{| class="wikitable mw-collapsible" data-expandtext="▼" data-collapsetext="▲"
!Mój || Nagłówek
|-
| A || B
|-
| C || D
|}

Przycisk przełączania

Warto zauważyć, że w przypadju tabeli, link w drugiej kolumnie zwiększa szerokość tabeli w stosunku do tekstu zawartego w nim. Można ustalić, aby przełącznik był umieszczony w innym miejscu na stronie.

Aby to zrobić musimy przypisać ID do elementu. To ID musi być poprzedzone prefiksem mw-customcollapsible-, a następnie należy dodać unikalny tekst dla tego elementu. Korzystanie z powyższej tabeli, możemy dodać ID mw-customcollapsible-myTable.

Który zajmuje się samą tabelą. Następnie, możemy dodać przycisk/link/tekst z klasą mw-customtoggle-myTable (należy pamiętać, że class (klasa) i ID muszą mieć taki sam unikalny tekst).

<div class="mw-customtoggle-myTable wds-button wds-is-secondary">Pokaż/Ukryj tabelę</div>
{| class="wikitable mw-collapsible" id="mw-customcollapsible-myTable"
!Mój || Nagłówek
|-
| A || B
|-
| C || D
|}

Zmiana tekstu z użyciem klas zwyjania

<div class="mw-customtoggle-myFirstText mw-customtoggle-myOtherText" style="color:#c00">Kliknij tutaj, by przełączyć element</div>

<div class="mw-collapsible" id="mw-customcollapsible-myFirstText">
<div class="mw-collapsible-content">
{| class="wikitable" style="width:300px"
! Kolumna 1 !! Kolumna 2 !! Kolumna 3
|-
| 1 || 2 || 3
|-
| 4 || 5 || 6
|-
| 7 || 8 || 9
|}
</div>
</div>

<div class="mw-collapsible mw-collapsed" id="mw-customcollapsible-myOtherText">
<div class="mw-collapsible-content">

{| class="wikitable" style="width:300px"
|-
!Wiersz 1 
| 1 
| 2 
| 3  
|-
!Wiersz 2 
| 4 
| 5 
| 6
|-
!Wiersz 3 
| 7 
| 8 
| 9
|}
</div>
</div>

<div class="mw-customtoggle-myFirstText mw-customtoggle-myOtherText" style="color:#0a0">Kliknięcie tego także to zrobi!</div>

Usuwanie domyślnych nawiasów z przełączników

Poniższa reguła CSS może zostać dodana do arkusza stylów wiki, aby ukryć nawiasy w domyślnych lub własnych przzełącznikach:

.mw-collapsible-toggle-default::before,
.mw-collapsible-toggle-default::after {
    display: none;
}

Zobacz też

• Elementy zwijalne na MediaWiki.org

Dalsze wsparcie

Szukasz dalszego wsparcia lub masz pytanie? Sprawdź poniższe linki, aby dowiedzieć się więcej.

• Dowiedz się więcej, sprawdzając inne strony pomocy.
• Uzyskaj pomoc od innych użytkowników Fandomu w Dyskusjach na Centrum Społeczności.
• Skontaktuj się ze wsparciem Fandomu poprzez formularz kontaktowy.