버튼적용 방법.
본문
위의 소스를 다운받았는데요.
<section>
<p><button id="trigger-overlay" type="button">Open Overlay</button></p>
</section>
이부분을 누르면, 풀스크린 메뉴가 나타는거 같습니다.
이full-menu.html을 사용하지않고,
index.html 파일의 <li> 버튼 </li>을 누르면 그 html에서 이메뉴가 나오겠으리하고 싶은데요.
보통이면 <a href="#"> </a> #에 html을 넣으면되는데, 그럴경우는 html 자체가 나와버리니 .그렇게하면안될거같더라구요. 어떻게하면, 이버튼을 다른html에 적용할수있을까요 ㅜ ㅜ~?
답변 1
<link rel="stylesheet" type="text/css" href="css/normalize.css" />
<link rel="stylesheet" type="text/css" href="css/demo.css" />
<link rel="stylesheet" type="text/css" href="css/style1.css" />
<script src="js/modernizr.custom.js"></script>
<script src="js/classie.js"></script>
<script src="js/demo1.js"></script>
<!-- open/close -->
<div class="overlay overlay-hugeinc">
<button type="button" class="overlay-close">Close</button>
<nav>
<ul>
<li><a href="#">Home</a></li>
<li><a href="#">About</a></li>
<li><a href="#">Work</a></li>
<li><a href="#">Clients</a></li>
<li><a href="#">Contact</a></li>
</ul>
</nav>
</div>
이부분 다른페이지에 넣으시고 li 사이에 있는 버튼에 id="trigger-overlay" 를 넣으세요. 그럼 작동할겁니다.
이렇게하면 페이지가 세햐얗게되네요 ㅜ ㅜ 일단 감사드립니다.
