Plover-bot (tablica | edycje) m (Robot dodał be:Даведка:Табліцы/згортваюцца, uk:Довідка:Таблиці/що згортаються) |
m (+TR) |
||
(Nie pokazano 1 wersji utworzonej przez jednego użytkownika) | |||
Linia 1: | Linia 1: | ||
'''Zwijanie''' jest opcją do pokazywania (lub ukrywania) elementów HTML. |
'''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 |
+ | 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ę |
+ | Aby stworzyć zwijany element, wystarczy dodać do niego klasę „<code>mw-collapsible</code>”. |
== Przykłady == |
== Przykłady == |
||
Linia 44: | Linia 44: | ||
== Zaawansowane ustawienia == |
== Zaawansowane ustawienia == |
||
=== Stan początkowy === |
=== Stan początkowy === |
||
− | Aby ustawić stan początkowy dla zwijanego elementu można się posłużyć klasą |
+ | Aby ustawić stan początkowy dla zwijanego elementu można się posłużyć klasą „<code>mw-collapsed</code>” oraz „<code>mw-collapsible</code>”, przykład można ujrzeć poniżej: |
<pre> |
<pre> |
||
{| class="mw-collapsible mw-collapsed wikitable" |
{| class="mw-collapsible mw-collapsed wikitable" |
||
Linia 64: | Linia 64: | ||
=== Wybieranie zawartości zwijania === |
=== Wybieranie zawartości zwijania === |
||
− | Można również określić, która część zawartości może być zwijana używając |
+ | Można również określić, która część zawartości może być zwijana używając „<code>mw-collapsible-content</code>”. |
<source lang="html4strict" enclose="div"> |
<source lang="html4strict" enclose="div"> |
||
Linia 81: | Linia 81: | ||
=== Niestandardowe nazwy === |
=== Niestandardowe nazwy === |
||
− | Nie lubisz Rozwiń/Zwiń w linkach? Nie ma problemu! Zmień to używając |
+ | Nie lubisz Rozwiń/Zwiń w linkach? Nie ma problemu! Zmień to używając „<code>data-expandtext</code>” i „<code>data-collapsetext</code>”. |
<pre>{| class="wikitable mw-collapsible" data-expandtext="Illuminati" data-collapsetext="Deluminati" |
<pre>{| class="wikitable mw-collapsible" data-expandtext="Illuminati" data-collapsetext="Deluminati" |
||
Linia 102: | Linia 102: | ||
Jeśli zauważysz na przykładzie powyższej tabeli, że 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. |
Jeśli zauważysz na przykładzie powyższej tabeli, że 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 |
+ | Aby to zrobić musimy przypisać ID do elementu. To ID musi być poprzedzone prefiksem „<code>mw-customcollapsible-</code>”, a następnie należy dodać unikalny tekst dla tego elementu. Korzystanie z powyższej tabeli, możemy dodać ID „<code>mw-customcollapsible-myTable</code>”. |
− | Który zajmuje się samą tabelą. Następnie, możemy dodać przycisk/link/tekst z klasą |
+ | Który zajmuje się samą tabelą. Następnie, możemy dodać przycisk/link/tekst z klasą „<code>mw-customtoggle-myTable</code>” (należy pamiętać, że '''class''' (klasa) i '''ID''' muszą mieć taki sam unikalny tekst). |
<pre>{| class="wikitable mw-collapsible" id="mw-customcollapsible-myTable" |
<pre>{| class="wikitable mw-collapsible" id="mw-customcollapsible-myTable" |
||
Linia 127: | Linia 127: | ||
== Zobacz również == |
== Zobacz również == |
||
− | * [[w:c:dev:ShowHide|ShowHide]] |
+ | * [[w:c:dev:ShowHide|ShowHide]] na [[w:c:dev|Dev Wiki]] |
* [[mw:Manual:Collapsible elements|Collapsible elements]] w [[mw:|MediaWiki.org]] |
* [[mw:Manual:Collapsible elements|Collapsible elements]] w [[mw:|MediaWiki.org]] |
||
Linia 138: | Linia 138: | ||
[[pt:Ajuda:Collapsing]] |
[[pt:Ajuda:Collapsing]] |
||
[[ru:Справка:Сворачивание]] |
[[ru:Справка:Сворачивание]] |
||
+ | [[tr:Yardım:Daraltma]] |
||
[[uk:Довідка:Таблиці/що згортаються]] |
[[uk:Довідка:Таблиці/що згортаються]] |
||
[[zh:Help:摺疊]] |
[[zh:Help:摺疊]] |
||
− | |||
[[Kategoria:Edycja]] |
[[Kategoria:Edycja]] |
||
[[Kategoria:Pomoc]] |
[[Kategoria:Pomoc]] |
Wersja z 15:23, 29 gru 2019
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.
Numer | Litera |
---|---|
1 | A |
2 | B |
3 | C |
{| class="wikitable mw-collapsible" style="float:right" ! 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. Dla przykładu:
<div class="mw-collapsible">
Ten tekst jest zwijany.
</div>
Daje w rezultacie:
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 |}
Nagłówek | pozostaje widoczny |
---|---|
Ta | zawartość |
jest początkowo | ukryta |
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:
<div class="mw-collapsible-content">Ten tekst powinien być ukryty domyślnie.</div>
Ten tekst powinien być również widoczny
</div>
Co da w rezultacie:
Ten tekst nie jest zwijany; ale następny jest zwijany i ukryty domyślnie:
Ten tekst powinien być również widoczny
Niestandardowe nazwy
Nie lubisz Rozwiń/Zwiń w linkach? Nie ma problemu! Zmień to używając „data-expandtext
” i „data-collapsetext
”.
{| class="wikitable mw-collapsible" data-expandtext="Illuminati" data-collapsetext="Deluminati" !Mój || Nagłówek |- | A || B |- | C || D |}
Mój | Nagłówek |
---|---|
A | B |
C | D |
Przycisk przełączania
Jeśli zauważysz na przykładzie powyższej tabeli, że 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).
{| class="wikitable mw-collapsible" id="mw-customcollapsible-myTable" !Mój || Nagłówek |- | A || B |- | C || D |} <div class="mw-customtoggle-myTable wikia-menu-button">Pokaż/Ukryj tabelę</div>
Mój | Nagłówek |
---|---|
A | B |
C | D |