html - get size of displayed web page without browser application bars with css -


i creating simple web page displays text text input, , want make text input take whole displayed web page (without browser bar), 100vh technique includes browser bar , not want guess top bar size

here code:

function focus() { // focus element  	document.getelementbyid("title").focus();  }    document.addeventlistener('click', function (event) { // make sure user's focus stuck text input   	if (event.target !== document.getelementbyid("title")) {  		document.getelementbyid("title").focus();  	}  }, false);  window.onload = function () {document.getelementbyid("title").focus();};    function apply() { // applies title  	settimeout(function () {  		var str = document.getelementbyid("title").value;  		if (!str.replace(/\s/g, '').length) {  			document.title = "title-text";  		} else {  			document.title = str;  		}  	},1);  }
<!doctype html>  <html>  	<head>  		<meta charset="utf-8">  		<title>title-text</title>  	</head>  	<body>  		<input type="text" id="title" onkeypress="apply()" autocomplete="off">  	</body>  </html>
(the js binds focus text box)

use following css classes achieve this.

body{   margin:0;   overflow:hidden; }  #title{   height: 100vh;   width:100vw; } 

Comments

Popular posts from this blog

asynchronous - C# WinSCP .NET assembly: How to upload multiple files asynchronously -

aws api gateway - SerializationException in posting new Records via Dynamodb Proxy Service in API -

asp.net - Problems sending emails from forum -