Skip to main content

IsDocumentVisible

Page Visibility API를 사용하여 현재 문서의 표시 여부를 추적합니다.

IsDocumentVisible은 현재 문서의 가시성 상태를 반영하는 반응형 boolean을 제공합니다. visibilitychange 이벤트를 수신하고 자동으로 업데이트됩니다.

데모

Document visible: false

Became visible count: 0

사용법

		<script lang="ts">
	import { IsDocumentVisible } from "runed";
 
	const visible = new IsDocumentVisible();
</script>
 
<p>Document visible: {visible.current ? "Yes" : "No"}</p>
	

타입 정의

		type IsDocumentVisibleOptions = {
	window?: Window;
	document?: Document;
};
 
class IsDocumentVisible {
	constructor(options?: IsDocumentVisibleOptions);
	readonly current: boolean; // 문서가 보일 때 true, 숨겨질 때 false
}
	

참고사항

  • document.hiddenvisibilitychange를 통해 Page Visibility API를 사용합니다.
  • 브라우저가 아닌 컨텍스트에서는 current가 기본적으로 false입니다.

Contributors