Menu Zamknij

Tworzenie przycisku ukryj/pokaż zawartość (spojler) na stronę www

Ostatnia aktualizacja wpisu:

spoilerW przypadku potrzeby dodania większej ilości tekstu (np. kodu) do wpisu na stronę lub bloga przydatne może być stworzenie przycisku, który będzie pokazywał/ukrywał zawartość wybranego kontenera (div).


Jest to banalnie proste, wystarczy dodać w kodzie HTML wpis:

<button onclick=”if(document.getElementById(‚spoiler’) .style.display==’none’) {document.getElementById(‚spoiler’) .style.display=”}else{document.getElementById(‚spoiler’) .style.display=’none’}” title=”Click to Show/Hide Content” type=”button”>Pokaż/Ukryj</button>

Następnie wybraną treść należy obudować w takiego div’a:

<div id=”spoiler” style=”display: none;”> […zawartość…] </div>

Przykład:

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin dapibus urna metus, id rutrum dolor porta condimentum. Maecenas justo arcu, bibendum sit amet elit et, varius dictum libero. Pellentesque tempus velit velit. Etiam vehicula sagittis dui ut congue. Aliquam gravida nec lectus vitae hendrerit. Donec dignissim, ipsum vel fermentum rhoncus, magna lectus rutrum elit, nec tristique odio orci ac risus. Nam sed sem volutpat, auctor dui id, tempor arcu.

Mogą Cię też zainteresować:

Dodaj komentarz

avatar
  Subscribe  
Powiadom o