Hledáme nové posily do ITnetwork týmu. Podívej se na volné pozice a přidej se do nejagilnější firmy na trhu - Více informací.
Pouze tento týden sleva až 80 % na e-learning týkající se C a C++. Zároveň využij akce až 80 % zdarma při nákupu e-learningu - více informací.
discount week 80 + hiring

Diskuze: Ako zdvojiť modal?

Aktivity
Avatar
oliver.olejnik:4.10.2016 7:58

Čaute, vedeli by ste mi poradiť, ako to urobiť tak, aby jedno tlačidlo otvorilo registráciu a druhé by otvorilo prihlásenie? Tu je to, čo mám teraz, ale obidve tlačidlá otvoria iba registráciu. Vďaka za pomoc!

<div class="logo2">
            <button id="myBtn"><i class="fa fa-sign-in"> </i> &nbsp; PRIHLÁSENIE</button>
          </div>

          <div class="logo3">
            <button id="myBtn2"><!--<i class="fa fa-unlock-alt"> </i> &nbsp;--> REGISTRÁCIA</button>
          </div>

<!-- Trigger/Open The Modal 1 -->

<!-- The Modal -->
<div id="myModal" class="modal">

  <!-- Modal content -->
  <div class="modal-content">
    <span class="close">x</span>

        toto by malo byť prihlásenie..........

  </div>

</div>


<!-- Trigger/Open The Modal 2 -->

<!-- The Modal -->
<div id="myModal2" class="modal">

  <!-- Modal content -->
  <div class="modal-content">
    <span class="close">x</span>

       toto by mala byť registrácia...............

  </div>

</div>




 <script>

 // Get the modal
var modal = document.getElementById('myModal');

// Get the button that opens the modal
var btn = document.getElementById("myBtn");

// Get the <span> element that closes the modal
var span = document.getElementsByClassName("close")[0];

// When the user clicks on the button, open the modal
btn.onclick = function() {
    modal.style.display = "block";
}

// When the user clicks on <span> (x), close the modal
span.onclick = function() {
    modal.style.display = "none";
}

// When the user clicks anywhere outside of the modal, close it
window.onclick = function(event) {
    if (event.target == modal) {
        modal.style.display = "none";
    }
}

</script>


 <script>

 // Get the modal
var modal = document.getElementById('myModal2');

// Get the button that opens the modal
var btn = document.getElementById("myBtn2");

// Get the <span> element that closes the modal
var span = document.getElementsByClassName("close")[0];

// When the user clicks on the button, open the modal
btn.onclick = function() {
    modal.style.display = "block";
}

// When the user clicks on <span> (x), close the modal
span.onclick = function() {
    modal.style.display = "none";
}

// When the user clicks anywhere outside of the modal, close it
window.onclick = function(event) {
    if (event.target == modal) {
        modal.style.display = "none";
    }
}

</script>
 
Odpovědět
4.10.2016 7:58
Tento výukový obsah pomáhají rozvíjet následující firmy, které dost možná hledají právě tebe!
Avatar
David Hynek
Redaktor
Avatar
David Hynek:4.10.2016 11:44
btn.onclick = function() {modal.style.display = "block";}

proměnou btn tam máš sice dvakrát, ale po druhém použití změníš hodnotu té první. Takže si je očísluj a bude ti to fungovat. Nebo přidej rovnou funkci onclick do buttonu...

Akceptované řešení
+20 Zkušeností
+1 bodů
Řešení problému
Nahoru Odpovědět
4.10.2016 11:44
Čím víc vím, tím víc věcí nevím.
Děláme co je v našich silách, aby byly zdejší diskuze co nejkvalitnější. Proto do nich také mohou přispívat pouze registrovaní členové. Pro zapojení do diskuze se přihlas. Pokud ještě nemáš účet, zaregistruj se, je to zdarma.

Zobrazeno 2 zpráv z 2.