무아지경

[HTML] onclick 으로 페이지 이동시키기 두번째.. 본문

퍼블리싱/HTML5 + CSS3

[HTML] onclick 으로 페이지 이동시키기 두번째..

블리셔 2020. 10. 13. 15:27

onclick로 페이지 이동시키기

 

예전에 비슷한 onclick을 이용하여 페이지 이동 시키는 글을 작성한 적이 있다.

이때 사용 목적은 메인 페이지와 서브페이지 3~4 페이지를 만들어 놓고

실제 페이지 메뉴 클릭하면 실제 서비스중인 페이지처럼 보이게 하려는 목적이었고..

지금도 시안을 보여주기 위해 사용중인 방법이다.

 

실제로 a링크가 아닌 버튼을 이용해 페이지를 이동시켜야 할일이 생겨서 다시 한번 찾아봤다.

 

우선 첫번째 일반적인 onclick를 이용한 방법

<button type="button" class="navyBtn" onClick="location.href='http://www.naver.com'">네이버 이동</button>
cs

 

두번째 새창으로 페이지 열기 : target="_blank" 와 같은 역할**

<button type="button" class="navyBtn" onClick="window.open('http://www.daum.net')">다음 새창 이동</button>
cs

 

세번째 팝업으로 새창 열기

<button type="button" class="navyBtn" onClick="window.open('http://www.naver.com','네이버','width=800, height=700, toolbar=no, menubar=no, scrollbars=no, resizable=yes');return false;">네이버 새창 열기</button>
cs

 

꼭 버튼이 아니더라도 li, div, span 등에도 사용 가능한 것 같다.

Comments