Hi all! I’m making an engaging and interactive online textbook. I would like the text to be read aloud to the user, but am having trouble implementing a text-to-speech api.
HTML: (I used bootstrap if that makes a difference for implementing)
This gives me a play button on my page. I would like the user to be able to press the button to initiate the text-to-speech:
<span class="glyphicon glyphicon-play" id='button' aria-hidden="true"></span>
I’ve tried a lot of different ways of implementing the JS with no luck.
Thanks for all of your help!
Hi randelldawson, here is the latest version:
HTML:
<script src="//code.jquery.com/jquery.min.js"></script>
<script src="articulate.js"></script>
<span class="glyphicon glyphicon-play" id='button' aria-hidden="true"></span>
JS:
$(button).articulate('speak');
My html seems to be disappearing when I try to include it?
My apologies! I uploaded to jsfiddle: https://jsfiddle.net/#&togetherjs=dAv67B0D6n
Nothing at all is coming up in console
I’ve edited your post for readability. When you enter a code block into the forum, precede it with a line of three backticks and follow it with a line of three backticks to make easier to read. See this post to find the backtick on your keyboard. The “preformatted text” tool in the editor (</>
) will also add backticks around text.
This is why your HTML was invisible in your first post.
Thank you so much for your quick responses and help! I will fix these changes and post followup questions here. I appreciate this so much thank you!
Thank you for letting me know!