2017-12-30 40 views
0

내 프로젝트를 계속 진행 함 버튼 클릭시 트리거되는 모달 (팝업) 창과 동일한 코딩 된 div로 문제를 만났습니다. 여기동일한 코딩 된 divs가 작동하지 않음

당신은 문제를 발견 할 수 있습니다 - 'O mnie'(약) 창 잘 작동을하고, 같은 코드 '연락처 기술'(접촉) 윈도우가 작동하지 - 잘 (여부) 작업 코드의 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>

+0

단순한 오타 :'button3.onlick를 ''button3.onclick'이어야합니다. 투표를 종료합니다. – Moob

답변

1

단순한 오타!

button3. onlick = 함수() {...

읽어야합니다

button3.onclick = function() { 

(예 : "onclick을"하지 "onLick")

+0

나는이 오타를 발견하는 것이 좋았 더라면 좋겠다. 감사합니다 –

+0

그는 1 분 정도 나를 이겼습니다. 그러나 이것은 주석이있는 타이포로 끝나야 만합니다. 이것은 완전한 해답이 될만한 가치가 없습니다. – Barmar

+0

@Barmar가 동의했습니다. – Moob