나만의 Picture-In-Picture 비디오 기능 북마크릿 만들기

표지 이미지 작성자: charlesdeluvio

...

일부 웹사이트 및 비디오 스트리밍 서비스에는 Picture-in-Picture 모드에서 비디오를 시청할 수 있는 기능이 있지만 일종의 페이월 뒤에 이 기능을 잠그거나 구독 혜택을 제공합니다.

일부 웹사이트에는 이 기능이 전혀 없습니다!

이 기능은 모든 최신 웹 브라우저에 내장되어 있고 특별한 노력, 구매, 플러그인 또는 해킹 없이 이 기능을 사용하는 방법을 아는 사람들이 무료로 사용할 수 있기 때문에 이것이 화가 납니다.

방법은 다음과 같습니다.

옵션 1 - 웹 브라우저 개발 도구를 통해 코드 입력

• 웹 브라우저의 개발 도구를 엽니다(일반적으로 F12 키를 누르거나 마우스 오른쪽 버튼을 클릭하고 요소 검사를 선택합니다)
• 콘솔 탭으로 이동
• 다음 코드를 붙여넣으세요.

// find the video element (may not work on sites with multiple video elements, but works for most of the main sites)
var vid = document.querySelector("video");

// remove the attribute that might stop us from launching the video in PiP
vid.removeAttribute("disablePictureInPicture");

// finally, request the PiP
vid.requestPictureInPicture();

이제 동영상이 팝업으로 표시됩니다. 그렇지 않은 경우 document.querySelector("video")를 조정하여 페이지의 특정 비디오 요소를 선택해야 할 수도 있습니다.

옵션 2 - 북마크 버튼을 생성하여 PiP 실행

이 코드는 옵션 1의 예시와 동일하지만 URL로 실행할 수 있도록 한 줄씩 줄였습니다.

사용 방법은 다음과 같습니다.

• 다음 항목을 모두 선택하고 브라우저의 북마크바에 끌어다 놓거나
• PiP라는 새 북마크를 만들고 다음을 북마크 URL로 붙여넣습니다. 자바스크립트: var vid=document.querySelector('video');vid.removeAttribute('disablePictureInPicture');vid.requestPictureInPicture();
• PiP를 실행하려면 북마크를 클릭하세요

"북마크릿"은 어떻게 작동하나요?

일반적으로 북마크를 사용하면 새 웹페이지로 이동합니다. 북마크릿은 새 페이지로 이동하는 대신 현재 페이지에서 자바스크립트를 실행하는 북마크입니다. 북마크릿임을 선언하기 위해 북마크가 가리키는 "위치"는 javascript:.

로 시작합니다.

— 케이시와츠

여기서 놀라운 점은 URL 시작 부분에 자바스크립트를 추가한다는 것입니다. 이는 새 페이지로 이동하는 대신 현재 페이지에서 작업을 수행하도록 브라우저에 지시합니다.

북마크릿에 대한 자세한 내용과 창의력을 발휘하려면 북마크릿 만들기에 대한 @caseywatts의 훌륭한 설명을 참조하세요

...

원문: https://mothy.dev/posts/free-picture-in-picture

위 내용은 나만의 Picture-In-Picture 비디오 기능 북마크릿 만들기의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!