2013-05-11 3 views
1

그래서 전체 화면으로 나가려면 두 개의 버튼이 있고 전체 화면을 종료하려면이 자바 스크립트 조각이 있습니다. 나는 전체 화면이 아니라면 전체 화면으로 가고 전체 화면으로 돌아갈 때 버튼이 전체 화면을 종료한다고 말합니다. 그래서 기본적으로 하나의 버튼 만 입력/종료해야합니다. 전체 화면.Javascript button

<html> 
<head> 
<script> 
function launchFullscreen(element) { 
if(element.requestFullScreen) { 
element.requestFullScreen(); 
} else if(element.mozRequestFullScreen) { 
element.mozRequestFullScreen(); 
} else if(element.webkitRequestFullScreen) { 
element.webkitRequestFullScreen(); 
} 
} 

function cancelFullscreen() { 
if(document.cancelFullScreen) { 
document.cancelFullScreen(); 
} else if(document.mozCancelFullScreen) { 
document.mozCancelFullScreen(); 
} else if(document.webkitCancelFullScreen) { 
document.webkitCancelFullScreen(); 
} 
} 

</script> 
</head> 
<body> 

<button onclick="launchFullscreen(document.documentElement);">Launch Fullscreen</button> 

<button onclick="cancelFullscreen();">Hide Fullscreen</button> 

</body> 
</html> 

답변

1

먼저 버튼에 ID를 지정해야합니다.

<button id="fsBtn" onclick=launchFullscreen(document.documentElement)>Enter Full Screen</button> 

버튼이 버튼을 눌렀을 때, 당신은 내부 버튼의 innerHTML을 값을 변경 할 수 있습니다 "전체 화면()"기능 :

document.getElementById("fsBtn").innerHTML = "Exit Full Screen"; 

당신은 또한 버튼의 OnClick 값을 변경할 수 있습니다

document.getElementById("fsBtn").onclick = cancelFullscreen; 
+0

@adamjcSweet 이것은 작동하지만 그렇습니다. 한 번만. 내가 원했던 버튼이 하나 있는데, 전체 화면으로 들어가라고 말하면, 그것을 클릭하면 전체 화면으로 돌아가고 전체 화면을 종료한다고 말하면서 전체 화면을 종료하면 전체 화면으로 돌아갑니다. 고마워....... 그것에 관한 일은 좀 더 있지만, 빠른 해결책을 안다면 나에게 알려줘. –

+0

cancelFullscreen 함수에서 버튼 innerHTML을 "전체 화면 입력"으로 변경하고 onclick 값을 enterFullscreen 함수에 할당하는 유사한 코드를 원할 것입니다. – adamjc

+0

나는 이것을 .... 작품 + 사용자 정의 이미지도 추가했습니다. var screenFull = false; var img = new Image ('button'). src = ".//imimages/up_full.fw.png"; document.getElementById ('button'). src = ".//imimages/up_full.fw.png"; 기능 togle() { if (screenFull) { cancelFullscreen(); \t document.getElementById ('button'). src = ".//images/up_full.fw.png"; screenFull = false; } else { launchFullscreen (document.documentElement); document.getElementById ('button'). src = ".//imimages/down_full.fw.png"; \t screenFull = true; –

1

추가 ID 버튼을 그냥 버튼을 전 전환 :