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

/home/kozerus/public_html

<html>
<head>
	<title>trigger2.html 20204818_1330</title>


	<script id="script_trigger2">
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();
});

var click = document.getElementById("click");
click.addEventListener("click", function() {
    /*
    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 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>output</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]-->

<!-- http://jsfiddle.net/termi/yjc5F/ -->
<!--	<script src="http://jsfiddle.net/termi/yjc5F/h123.ru/js/a.js"></script> -->
<!--
	<script src="http://h123.ru/js/a.js"></script>
	<script src="http://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