JavaScript Sayfayı Tam Ekran Yapma

N

Nazdravia

Ultra Member
Joined
Aug 1, 2019
Messages
606
Reaction score
164
DDF308A6-8497-44E4-8D14-66FE911ADAD8.png
Bu örneğimizde JavaScript ile sayfamıza bir buton ekleyeceğiz. Daha sonra bu butona tıklayarak sayfamızın tam ekran olmasını sağlayacağız.

89ADB8C4-4467-45AC-A403-C60DAF4E9994.png

JavaScript:
<!DOCTYPE html>
<html>
<head>
<style type="text/css">
#tamekran:-moz-full-screen {
padding: 42px;
background-color: pink;
border:2px solid #f00;
font-size: 200%;
}
#tamekran:-ms-fullscreen {
padding: 42px;
background-color: pink;
border:2px solid #f00;
font-size: 200%;
}
#tamekran:-webkit-full-screen {
padding: 42px;
background-color: pink;
border:2px solid #f00;
font-size: 200%;
}
#tamekran:fullscreen {
padding: 42px;
background-color: pink;
border:2px solid #f00;
font-size: 200%;
}
 
#tamekran:-moz-full-screen > h1 {
color: red;
display: block;
}
#tamekran:-ms-fullscreen > h1 {
color: red;
display: block;
}
#tamekran:-webkit-full-screen > h1 {
color: red;
display: block;
}
 
 
#tamekran:-moz-full-screen > button {
display: none;
}
#tamekran:-ms-fullscreen > button {
display: none;
}
 
#tamekran:-webkit-full-screen > button{
display: none;
}
 
#tamekran:fullscreen > button {
display: none;
}
 
#tamekran:fullscreen > button {
display: none;
}
 
#tamekran:fullscreen > h1 {
color: red;
}
 
#tamekran > h1{
display: none;
}
</style>
 
</head>
<body>
 
<div id="tamekran">
<h1>Tam Ekran Yaptınız</h1>
<button id="tamekran-button">Tam Ekran Yap</button>
</div>
 
 
<script type="text/javascript">
var tamEkranButon = document.getElementById("tamekran-button");
 
function tamEkranYap() {
/*tam ekran yapılacak div*/
var tamEkranDiv = document.getElementById("tamekran");
 
/*tarayıcının tam ekranı destekleyip desteklemediğini kontrol edyiyoruz. Tam ekran yapılacak div ile.*/
var tamEkranFonk=tamEkranDiv.requestFullscreen||
tamEkranDiv.mozRequestFullScreen||
tamEkranDiv.msRequestFullscreen||
tamEkranDiv.webkitRequestFullScreen;
 
tamEkranFonk.call(tamEkranDiv);
}
tamEkranButon.addEventListener('click', tamEkranYap);
</script>
 
</body>
</html>
 
R

Rooster

only business
Super Moderator
Joined
Aug 10, 2019
Messages
3,215
Reaction score
4,728
Location
Milano
Reality cheats şablonları kullanıp konu açman harika birşey :D
 
SPAM IS FORBIDDEN!
  • SPAMMERS ARE BANNED FROM THE FORUM AND CANNOT USE ANY OF THE CHEATS
  • For example: thanks, thx, very good, asdqwe, working, ty and so on!
  • For example: Writing the same message over and over. thanks, thx and so on!
  • Copying and copying someone else's message is prohibited.
  • It is forbidden to send messages to increase the number of comments on threads that you have no knowledge of.
  • Write your own opinion when commenting!
  • If you see spam message, please let us know with the REPORT button!

Tema düzenleyici

Top Bottom