This example shows how to create a text to speech speaking keyboard allowing the visitor to hear keystrokes as they enter them.
This is example code to add anywhere in a page where you want the Text to Speech Speaking Keyboard to appear.
1 2 3 4 5 6 |
<script src="https://code.responsivevoice.org/responsivevoice.js"></script> <script src="https://code.jquery.com/jquery-2.1.4.min.js"></script> <script>var keyCodes = [];$("#reset").click(function() { keyCodes = []; $("#in").val(""); $("#key-codes").html("var keyCodes = [ ];"); $("#key-names").html("var keyNames = [ ];");}); $(document).keydown(function(e) { keyCodes.push(e.which); responsiveVoice.speak(keyboardMap[e.which], "UK English Female", {pitch: 1.4, rate: 1.5}); });</script> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> <textarea id="in" cols="45" rows="3">Hello world</textarea> |
Keywords: text to speech speaking keyboard, interactive spoken keys