> 웹 프론트엔드 > CSS 튜토리얼 > JavaScript로 사용자 정의 크기 팝업 창을 여는 방법은 무엇입니까?

JavaScript로 사용자 정의 크기 팝업 창을 여는 방법은 무엇입니까?

Mary-Kate Olsen
풀어 주다: 2024-10-30 07:23:02
원래의
694명이 탐색했습니다.

How to Open a Custom-Sized Pop-Up Window with JavaScript?

사용자 정의 차원으로 새 창 팝업

웹 개발에서 때로는 특정 목적을 위해 새 창을 여는 것이 바람직할 때가 있습니다. 소셜 미디어 플랫폼에서 콘텐츠를 공유하는 것과 같은 것입니다. 그러나 target="_blank"를 사용하면 새 창의 크기 및 동작과 관련하여 원하는 사용자 정의 옵션이 제공되지 않을 수 있습니다.

이러한 측면을 제어하려면 JavaScript를 활용하여 원하는 결과를 얻을 수 있습니다. 다음 코드 조각을 고려하세요.

<code class="html"><a href="facebook.com/sharer" onclick="window.open(this.href, 'mywin',
'left=20,top=20,width=500,height=500,toolbar=1,resizable=0'); return false;">Share this</a></code>
로그인 후 복사

이 코드는 다음을 달성합니다.

  1. 새 탭을 열지 못하도록 target="_blank" 속성이 제거됩니다.
  2. 링크를 클릭할 때 JavaScript를 호출하기 위해 onclick 핸들러가 추가되었습니다.
  3. window.open() 함수는 특정 매개변수로 호출됩니다.
    a. this.href: 공유할 URL입니다.
    b. 'mywin': 새 창의 이름.
    c. 쉼표로 구분된 일련의 속성:
    i. 왼쪽 및 위쪽: 화면에서 창의 위치를 ​​픽셀 단위로 지정합니다.
    ii. 너비 및 높이: 창의 크기를 픽셀 단위로 정의합니다.
    iii. 도구 모음=1: 창에 도구 모음이 표시되도록 지정합니다.
    iv. resizing=0: 사용자가 창 크기를 조정하는 것을 방지합니다.

위 내용은 JavaScript로 사용자 정의 크기 팝업 창을 여는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
저자별 최신 기사
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿