Skip to content

Instantly share code, notes, and snippets.

@nfreear

nfreear/simple-speak.demo.html

Last active May 31, 2017 09:13
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save nfreear/3e6255fe4283353e8aa2f62094ae91c9 to your computer and use it in GitHub Desktop.
Save nfreear/3e6255fe4283353e8aa2f62094ae91c9 to your computer and use it in GitHub Desktop.
Download ZIP
simple-speak demo | Nick Freear, 28-May-2017 ~ https://github.com/nfreear/simple-speak
Raw
simple-speak.demo.html
<!doctype html> <meta charset="utf-8"> <title> simple-speak </title>
<style>
body { font: 1em sans-serif; max-width: 38em; margin: 1em auto; color: #222; }
h1 { font-weight: normal; }
form { display: block; margin: 1em 0; }
input { font-size: 1em; }
input#id-simplespeak { min-width: 15em; }
#XX-no-compat-simple-speak-msg { color: darkorange; font-weight: bold; }
</style>
<h1> simple-speak </h1>
<!--
<p id="no-compat-simple-speak"> Sorry! Speech synthesis is not available in your browser. </p>
-->
<p><label >Speech input <input id="XX--id-simple-speak" value="Hi. I'm a text input box!"></label>
<div id="id-simple-speak">
<p> Hello world!
<p>Lorem ipsum dolor sit amet, eam tacimates perpetua at, vel ea novum vivendum expetendis.
</div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>
<script data-src="../src/simple-speak.orig.js" ></script>
<script data-src="../bundle.js"></script>
<script id="local" data-src="../build/simple-speak.js" data-simple-speak='{ "voiceFamily": "Kathy", "X-override_compat": true }'></script>
<script id="dev-cdn" src="https://rawgit.com/nfreear/simple-speak/master/build/simple-speak.js"></script>
<pre>
© Nick Freear, 28-May-2017.
* https://github.com/nfreear/simple-speak
* https://developer.mozilla.org/en-US/docs/Web/API/SpeechSynthesis
</pre>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment