Ta strona używa ciasteczek (cookies), dzięki którym nasz serwis może działać lepiej. Dowiedz się więcej OK, rozumiem

Rozwijanie i zwijanie tekstu w ramce po kliknięciu

Zaczynasz dopiero swoją przygodę z HTML'em? A może mimo swojego doświadczenia natknąłeś się na jakiś problem? Tutaj na pewno znajdziesz pomoc.

Rozwijanie i zwijanie tekstu w ramce po kliknięciu

Post 14.06.2017, 13:44:41

Witam szukałam wszędzie i nie mogłam znaleźć.
Potrzebuje 6 okienek z tekstem, które po kliknięciu w ten tekst otworzy się okienko z opisem. Po kolejnym kliknięciu ten opis zwinie się. Natomiast po kliknięciu każdego okienka po kolei wszystkie opisy zostaną. Chodzi mi oto, że jak kliknę w pierwsze okienko to pojawi się opis, po czym jak kliknę w drugie okienko to też pojawi się opis do drugiego okienka, ale nie zniknie opis pierwszego okienka.

Udało mi się napisać kod na 2 okienka, ale po skopiowaniu tych dwóch tak, aby było 6 to tylko działa pierwsze okienko, a reszta nie.
Kod: Zaznacz cały
<html>
    <head>
        <title>Style - przykład</title>
        <script type="text/javascript">
            function toggle(sDivId) {
                var oDiv = document.getElementById(sDivId);
                oDiv.style.display = (oDiv.style.display == "none") ? "block" : "none";
            }
        </script>
    </head>
    <body>
        <div style="background-color: blue; color: white; font-weight: bold; padding: 10px; cursor: pointer"
             onclick="toggle('divContent1')">Kliknij tutaj</div>
        <div style="border: 3px solid blue; height: 100px; padding: 10px"
             id="divContent1">Tę zawartość można zwijać i rozwijać.</div>
        <p>&nbsp;</p>
        <div style="background-color: blue; color: white; font-weight: bold; padding: 10px; cursor: pointer"           
           onclick="toggle('divContent2')">Kliknij tutaj</div>
        <div style="border: 3px solid blue; height: 100px; padding: 10px"
             id="divContent2">Tę zawartość można zwijać i rozwijać.</div>


    </body>
</html>


Proszę skopiować ten kod zapisać jako index.html i zobaczyć w przeglądarce jak to wygląda. Ma być tak samo jak jest teraz tylko, że 6 okienek.
Proszę o pomoc.

Marta
dlugamarta
Posty: 2
Dołączył(a): 14.06.2017


Re: Rozwijanie i zwijanie tekstu w ramce po kliknięciu

Post 14.06.2017, 23:51:53

kuku napisał(a):http://jsbin.com/mokeyepivo/edit?html,output

Wielkie dzięki jutro przeanalizuje kod.
dlugamarta
Posty: 2
Dołączył(a): 14.06.2017


Powrót do Początkujący webmaster


 


  • Podobne wątki
    Odpowiedzi
    Wyświetlone
    Ostatni post

Kto przegląda forum

Użytkownicy przeglądający ten dział: Brak zidentyfikowanych użytkowników i 8 gości

Hosting, Domeny, SSL
iCash

Subskrypcja

Mamy 50186 zarejestrowanych użytkowników.
Najnowszy użytkownik: sskijop


Nasi użytkownicy napisali:

  • 935210 wiadomości
  • w 246392 tematach

Najnowsze wpisy na blogu

Najnowsze artykuły

Najaktywniejsi (ostatnie 30 dni)