Whenever I try to exit the Fullscreen in the console it shows that exitFullscreen is not a function
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title></title>
</head>
<body>
<button onclick="o()">O</button>
<button onclick="x()">X</button>
<script type="text/javascript" charset="utf-8">
function o(){
document.documentElement.requestFullscreen();
}
function x(){
document.documentElement.exitFullscreen();
}
</script>
</body>
</html>
From the code above by clicking on button x I should exit Fullscreen but it is not happening
Look at the documentation.
requestFullscreen is a method on elements
exitFullscreen is a method on the document
use this for exit the full screen
document.exitFullscreen();
Related
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<head>LOOPS</head>
<h1 id="string"></h1>
<script language="javascript" type="text/javascript">
let w = 10;
while(w<=15){
console.log(w)
if(w==13){
continue;
}
w++
};
</script>
</body>
</html>
So...As you can see here, Whenever i live reload this on my browser(firefox, chrome) It just keeps on reloading and dosen't open but when i use the for loop and then use the if condition to skip a loop, It opens.
Please is there something i'm doing wrong, Because i just started learning javascript.
It's because you're creating an infinite loop. When you have the if statement and the continue keyword, it will skip to the next loop without incrementing w variable.
hay if anybody understand why is prompt showing up even before the console printing
i appreciate the help
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>promptheadache</title>
</head>
<body>
<script>
console.log('i should appear first on the console')
var promptInput = prompt('I\'m am here befor anything else')
</script>
</body>
</html>
console.logs are actually asynchronous in that they are synchronized (as in always in order) but perform an asynchronous call.
prompt is a very old API and one of the few that actually blocks the page - so even-though it appears after the console.log you see it as soon as it is called.
That said - this is not true for every console nor is it guaranteed - the console.log may appear before the prompt depending on the browser/console implementation.
If you want to get the console before prompt you can add setTimeOut-setTimeout() is an asynchronous function.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>promptheadache</title>
</head>
<body>
<script>
console.log('i should appear first on the console')
setTimeout(() => {var promptInput = prompt('I\'m am here befor anything else')
},5000)
</script>
</body>
</html>
i wrote this simple function to show a message when you close the window but it didnt work.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body onunload="closing()">
<script language="javascript">
function closing(){
alert('Bye');
}
</script>
</body>
</html>
Your popup blocker might block it. MDN docs source
That sort of behavior - alerts popping up on a close, are usually not desired by users.
Did you try using the unload event?
I just wonder what I am doing with console.log is wrong or not.
I have simple two files as below:
index.html
index.js
and when opening the index.html in chrome(c:\temp\index.html), it does not output console.log message in console tab as below.
So am I missing something?
As you can see, if you run it below code, it shows console.log properly.
function doSomething() {
console.log("Work!");
}
doSomething();
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
</head>
<body>
<div>Hi</div>
<script scr='index.js'> </script>
</body>
</html>
Looks like you have a typo:
<script scr='index.js'>
should be
<script src='index.js'>
function doSomething() {
console.log("Work!");
}
doSomething();
<div>Hi</div>
<script src='index.js'> </script>
You have to change scr to src in that way it will works.
just trying to get jquery mobile firing with phonegap, but I can't get my hello world firing.
All of the references to the Js is correct.
<!DOCTYPE html>
<html>
<head>
<title></title>
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no;" />
<meta charset="utf-8">
<link rel="stylesheet" href="style.css" type="text/css" media="screen" charset="utf-8">
<script type="text/javascript" charset="utf-8" src="phonegap-1.1.0.js"></script>
<script type="text/javascript" charset="utf-8" src="jquery.js"></script>
<script type="text/javascript" charset="utf-8" src="jquery_mobile.js"></script>
<script type="text/javascript">
document.addEventListener("deviceready", onDeviceReady, false);
function onDeviceReady() {
$(document).ready(function() {
$(document).bind("deviceready", function(){
navigator.notification.alert("hello world");
});
});
}
</script>
</head>
<body>
</body>
</html>
Try this:
<!DOCTYPE HTML>
<html>
<head>
<meta name="viewport" content="width=320; user-scalable=no" />
<meta http-equiv="Content-type" content="text/html; charset=utf-8">
<title>Hello With JQuery Mobile</title>
<link rel="stylesheet" href="jquery.mobile/jquery.mobile-1.0rc1.min.css" type="text/css" charset="utf-8" />
<script type="text/javascript" src="jquery.mobile/jquery-1.6.4.min.js"></script>
<script type="text/javascript" charset="utf-8" src="phonegap-1.1.0.js"></script>
<script type="text/javascript" src="jquery.mobile/jquery.mobile-1.0rc1.min.js"></script>
<script type="text/javascript">
var onDeviceReady = function() {
alert("OnDeviceReady fired.");
};
function init() {
document.addEventListener("deviceready", onDeviceReady, true);
}
</script>
</head>
<body onload="init();">
</body>
</html>
Did you include the reference where the html and js ar located in Xcode?
You should try to start debugging by placing something in the body of the html and see if that appears when you compile and run.
Try removing the addEventListener and Function like this:
<script type="text/javascript">
$(document).ready(function(){
$(document).bind('deviceready', function(){
navigator.notification.alert("hello world");
});
});
</script>
There is no need to listen for 'deviceready' twice. The document will be ready first, followed by JQM firing deviceready.
I hope it helps!
I had a similar issue. Commenting out jquery or jquerymobile reference caused the app to work but i could not get it to work with both in the header. Both files were in the www folder of phonegap. I even tried referencing the code from the jquery.com but it didn't work.