相同的编码div不起作用

时间:2017-12-30 00:03:02

标签: javascript jquery html css

通过继续我的项目我遇到了一个问题,它有相同的编码div,它是模式(弹出)窗口触发按钮点击。

在这里你可以发现问题 - ' O mnie' (关于)窗口运行良好,同样编码' Kontakt' (联系)窗口无效 - http://antoszbk.pl/

代码片段运行良好(或不运行):

代码:



var aboutw = document.getElementById("myAbout");
var button1 = document.getElementById("aboutbtn");
var span = document.getElementsByClassName("close")[0];

var contactw = document.getElementById("myContact");
var button3 = document.getElementById("contactbtn");
var span2 = document.getElementsByClassName("close2")[0];


window.onload = function() {

  button1.onclick = function() {
    aboutw.style.display = "block";
    aboutw.style.animation = "slideInDown 0.5s";
  }

  span.onclick = function() {
    aboutw.style.animation = "slideOutUp 0.5s";
    setTimeout(function() {
      aboutw.style.display = "none";
    }, 500);
  }

  button3.onlick = function() {
    contactw.style.display = "block";
    contactw.style.animation = "slideInDown 0.5s";
  }

  span2.onclick = function() {
    contactw.style.animation = "slideOutUp 0.5s";
    setTimeout(function() {
      contactw.style.display = "none";
    }, 500);
  }

  window.onclick = function(event) {
    if (event.target == aboutw || event.target == contactw) {
      aboutw.style.animation = "slideOutUp 0.5s";
      contactw.style.animation = "slideOutUp 0.5s";
      setTimeout(function() {
        aboutw.style.display = "none";
        contactw.style.display = "none";
      }, 500);
    }
  }
}

<div id="mySidenav" class="Sidenav">
  <a href="#about" id="aboutbtn">O mnie</a>
  <a href="#achievements">Portfolio</a>
  <a href="#contact" id="contactbtn">Kontakt</a>
</div>

// WORKING WELL
<div id="myAbout" class="about">
  <div class="about-content">
    <span class="close">&times;</span>
    <p> Wkrótce tutaj coś będzie... </p>
  </div>
</div>

// NOT WORKING WELL
<div id="myContact" class="contact">
  <div class="contact-content">
    <span class="close2">&times;</span>
    <p> Wkrótce tutaj coś będzie... </p>
  </div>
</div>
&#13;
&#13;
&#13;

1 个答案:

答案 0 :(得分:1)

只是一个简单的错字!

  

button3。 onlick = function(){...

应阅读:

button3.onclick = function() {

(即:&#34; onClick&#34; not&#34; onLick&#34;)