DIR : /home/kozerus/public_html/trigger1.html

/home/kozerus/public_html

<html>
<head>
	<title>trigger.html 20200418_1300</title>
	<script id="script_trigger1_js" src="trigger1.js" ></script>
	<script id="script_trigger1" >

// trigger1.js 20200418_1300
		void function () {
			var output = document.getElementById("output");
      
			output.prepend("'KeyboardEvent' constructor status: " + (/\[native\s+code\]/i.test(KeyboardEvent + "") ? "NATIVE" : "POLYFILL"))

			document.addEventListener("keydown", function(e) {
			output.insertAdjacentHTML("afterbegin", 
			"<b>char:&nbsp;</b>" + e.char + "&nbsp;|&nbsp;" +
			"<b>key:</b>&nbsp;" + e.key + "&nbsp;|&nbsp;" +
			"<b>shiftKey:</b>&nbsp;" + e.shiftKey + "&nbsp;|&nbsp;" +
			"<b>keyCode:</b>&nbsp;" + e.keyCode + "&nbsp;|&nbsp;" +
			"<b>location:</b>&nbsp;" + e.location + "<br/>") ;
      
			e.preventDefault();
			});

/*
KeyboardEvent constructor
http://www.w3.org/TR/DOM-Level-3-Events/#idl-interface-KeyboardEvent-initializers
https://github.com/termi/DOM-Keyboard-Event-Level-3-polyfill
*/
			var click = document.getElementById("click");
			click.addEventListener("click", function() {
				var keyEvent = new KeyboardEvent("keydown", {key : "a", char : "a", shiftKey: true});
				document.dispatchEvent(keyEvent);
				});
			}();  
		</script>

	</head>

<body bgcolor=wheat>
	More complex example can be found here: <a href="http://h123.ru/-/tests/KeyboardEvent/"> http://h123.ru/-/tests/KeyboardEvent/ </a>
	<br>
	This demo uses polyfill from <a href="https://github.com/termi/DOM-Keyboard-Event-Level-3-polyfill">https://github.com/termi/DOM-Keyboard-Event-Level-3-polyfill</a>
	<hr>
	<h3>Enter some text with uppercase and lowercase letters:</h3>
	<input />

	<h3>Click button to create sintetic KeyboardEvent with predefined 'a' "key" and "char"</h3>
	<button id=click><span>click to me to create a synthetic event</span></button>
	<br>

	<div id="output" style="background:green;min-height:40px">
		<h1>div_id_outout</h1>
		</div>
    
    
<!--[if lt IE 8]>
	<script src="//h123.ru/js/a.ielt8.js"></script>
	<![endif]-->
<!--[if IE 8]>
	<script src="//h123.ru/js/a.ie8.js"></script>
	<![endif]-->

	<script src="//h123.ru/js/a.js"></script>
	<script src="//h123.ru/js/DOMEventsLevel3.shim.js?1"></script>

	</body>
	</html>

koh5_pano

Drag mouse to navigate.

Navigation

Left/Right Mouse drag: Changes camera heading.
Up/Sown Mouse drag: Changes camera pitch.
Scroll wheel: Changes camera field of view.
I-Key: Displays Info panel with canvas size, image size and FPS.

17.Aug.2010, Martin Wengenmayer