PDA

View Full Version : Use javascript to activate a keyboard key



hanspdc
Mar 23rd, 2007, 06:17 PM
Dear Colleagues:

I am in need of a javascript (or php) that will activate/trigger/simulate an event identical to pressing a keyboard key.

Specifically: I currently need to press CTRL + F12 to get a text2voice application to speak a word on a page. I do not want to press CTRL + F12 but rather use a onMouseOver event to 'activate/trigger/simulate' as if I pressed CTRL + F12

Is this possible? If yes, how?

Please know that I searched the net for a few hours before asking.

*** Please only answer if you know the answer, because my javascript knowledge is mainly on a cut/paste level. I can modify and read scripts so-so, but create new ones is beyond my skills.

Hope you can help. THANKS

Hans

funktifyknow
Mar 23rd, 2007, 06:45 PM
Can you leave me a bit of the code that you are working with? I can then start working on a solution for ya. kinda hard to work on it if I don't know what you already have:p

Should be fairly simple tho, just a basic mouseOver event. I'd really like to help tho so if you post a bit of code I will see what I can do.

hanspdc
Mar 23rd, 2007, 08:53 PM
Wonderful and thanks for your willingness to share your knowledge...

HERE WE GO...

The code I have so far is copy/pasted below (in the PS). It's an entire XHTML page, so you can simply copy/paste it and testrun it.

What it does...
1) It shows four words, each within a paragraph <p>
2) On page refresh, it displays the paragrpahs in a soft background color;
3) Upon mouseover, the background color changes + the text is highlighted (which is required for the speech synthesizer to read it: the synthesizer only reads highlighted text);
4) On mouseout the highlight is removed and the background color is changed into a final color.

*** The speech synthesizer requires two things to 'speak' browser text:
a) Text highlighted with the mouse (which I do automatically through a mouseover);
b) A keyboard entry CTRL + F12 activates the speech synthesizer. And THAT is the final step I want to trigger through a mouseover.

So... the result I am looking for is the following...
i.) A page is rendered, all <p> carry a soft background color (DONE);
ii.) The mouse is rolled over a <p>, resulting in a background-color change (DONE), AND the highlighting of the paragraph text (DONE), AND the javascript 'activation or pressing' of CTRL + F12 (NOT YET DONE).

Hope this is clear, if not, drop me another line. THANKS AGAIN

Hans
****** The Test code completed so far (see below) ***********
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<style type="text/css">

p.off {
background: #ffffcc; padding:20px;
}
p.on {
background: #ff0000; padding:20px;
}
p.used {
background: #ffff00; padding:20px;
}

</style>
<script language="javascript">
function selectNode (node)
{
var selection, range, doc, win;

if ((doc = node.ownerDocument) && (win = doc.defaultView) && typeof
win.getSelection != 'undefined' && typeof doc.createRange !=
'undefined' && (selection = window.getSelection()) && typeof
selection.removeAllRanges != 'undefined')
{
range = doc.createRange();
range.selectNode(node);
selection.removeAllRanges();
selection.addRange(range);
}
else if (document.body && typeof document.body.createTextRange !=
'undefined' && (range = document.body.createTextRange()))
{
range.moveToElementText(node);
range.select();
}

}


function clearSelection ()
{
if (document.selection)
document.selection.empty();
else if (window.getSelection)
window.getSelection().removeAllRanges();
}


</script>
<title>Testpage</title>
</head>
<body>




<p class="off" onMouseOver="selectNode(this),this.className='on'";
onMouseOut="clearSelection(this),this.className='used';">test</p>
<p class="off" onMouseOver="selectNode(this),this.className='on'";
onMouseOut="clearSelection(this),this.className='used';">for</p>
<p class="off" onMouseOver="selectNode(this),this.className='on'";
onMouseOut="clearSelection(this),this.className='used';">brother</p>
<p class="off" onMouseOver="selectNode(this),this.className='on'";
onMouseOut="clearSelection(this),this.className='used';">lane</p>

</body>
</html>