Fullscreen жалған сыныбы

fullscreen жалған сыныбы элементтерге браузердің толық экран режимі үшін стиль белгілейді. Бетті көрсетудің стандартты режимінен толық экрандық режимге және керісінше өту үшін пернетақтадағы F11 түймесін басу керек.

Синтаксис

cssселектор:fullscreen {
  
}

Мысал

Тексті элементті толық экран режиміне шығарып, оның фонын басқа түске бояп көрейік:

html<div id="txt">
  Full screen
</div>
<p>
  <button onclick="fullScreen()">Басу</button>
</p>

cssbody {
  margin: 0;
}
#txt {
  padding: 10px;
  background: #467CBC;
  color: white;
  width: 200px;
}
#txt:-webkit-full-screen {
  background: #E37D76;
}
#txt:-moz-full-screen {
  background: #E37D76;
}
#txt:-ms-fullscreen {
  background: #E37D76;
}

javascriptfunction fullScreen() {
  let elem = document.getElementById('txt'); // Элементті аламыз
  if (elem.webkitRequestFullscreen) elem.webkitRequestFullscreen(); // Chrome, Opera, Safari
  else if (elem.mozRequestFullScreen) elem.mozRequestFullScreen(); // Firefox
  else if (elem.msRequestFullscreen) elem.msRequestFullscreen(); // Internet Explorer, Edge
  else if (elem.requestFullscreen) elem.requestFullscreen();
}

Результат:

Сондай-ақ қараңыз