I am creating simulation for a software in storyline. This simulation has function keys interactivity - F2,F3,F10,F11. I was able to write trigger code - Jump to Slide when user presses F3 keys. When I am publishing this project, the function keys are responding to the browser function keys. e.g. when I press F3, instead of going to slide F3, its showing browser's find feature. I tried to do research on google and articulate forum for how to use functions for simulation its leading me JavaScript. I understand that I need to use trigger - Excute JavaScript in Storyline. But I don't know how to write a javascript. I need JavaScript which will disable browsers function key e.g. F3 and if user presses F3 it should go to the next slide. I guess I need two JavaScripts; the one which will disable browser's function key, and the other which will assign the user defined function that is go to F3 slide if user presses F3 funciton key. I know there are tons of website which will give you javascript code. But I find it difficult execute in the Storyline. I have created an example and uploaded the storylline file in this message. Please help me to write the javascript in storyline. Thanks in Advance.

I think I may have a solution for you. go to this website http://www.quirksmode.org/js/keys.html determine the keycode for the functino key you want to disable (F1 is 112, F2 is 113 etc) add a trigger to the slide that needs to have the function key disabled to execute javascript.when timeline starts and enter this script. document.onkeydown = function (e) { if(e.which == 113){ return false; } } changing the number 113 to whatever the code is for your function key, it really works

SL360 version of the above code attached below. Also has layers for the Shift + Functions.See it in action: Link to DemoTested on Chrome and MS Edge.

Hi Brandon! I was able to get them to work with Storyline 360. It does stink that you have to upgrade to the newer version to get those to work but once I did it worked great!

I have never been able to get that code to work when I put it in, but could be user error. However if you want to eliminate using java in your program the storyline 360 is the way to go. All I had to do was create a trigger to jump to the next page when user clicks F5 and its good to go! But it is good to know that it is a possibility to get done in S2!

Has anyone came across with this? Thanks.

Function Keys Interactivity in Storyline Using JavaScript

49 Replies

LynnStocks
Community Member
12 years ago

I think I may have a solution for you.

go to this website

http://www.quirksmode.org/js/keys.html

determine the keycode for the functino key you want to disable (F1 is 112, F2 is 113 etc)

add a trigger to the slide that needs to have the function key disabled to execute javascript.when timeline starts and enter this script.

document.onkeydown = function (e) {

        if(e.which == 113){

                return false;

        }

}

changing the number 113 to whatever the code is for your function key,

it really works
OwenHolt
Super Hero
7 years ago
SL360 version of the above code attached below. Also has layers for the Shift + Functions.

See it in action: Link to Demo

Tested on Chrome and MS Edge.
F-Key_Test_V360.story95 KB
- WGill
  Community Member
  3 months ago
  
  OWEN HOLT
  
  SL360 version of the above code attached below. Also has layers for the Shift + Functions.
  
  See it in action: Link to Demo
  
  Tested on Chrome and MS Edge.
  
  Hi Owen,
  
  Thanks for working on this a few years ago.
  It looks like the .story file you sent worked when using a classic player but when using the modern player the F11 key doesn't keep the browser from maximizing/minimizing it's window.
  
  Do you happen to know of a different solution to this question?
  
  I appreciate your time.
  
  Thank you.
ChelseaJohnson-
Community Member
7 years ago
Hi Brandon! I was able to get them to work with Storyline 360. It does stink that you have to upgrade to the newer version to get those to work but once I did it worked great!
- BCHarper
  Community Member
  7 years ago
  Woah?! What?! Can you give me some more details on this, please?!
  
  This may be helpful for my organization to have an incentive to get the upgrade to 360!
  - OwenHolt
    Super Hero
    7 years ago
    No need to upgrade, I tested in SL2 and it works there as well. See the attached SL2 file where I have disabled keys F1 through F12 and added an action to each key to show a different layer.
    
    The JS code I used is a series of else if statements:
    
    document.onkeydown = function (e) {
    if(e.which == 112){
    return false;
    } else if(e.which == 113){
    return false;
    } else if(e.which == 114){
    return false;
    } else if(e.which == 115){
    return false;
    } else if(e.which == 116){
    return false;
    } else if(e.which == 117){
    return false;
    } else if(e.which == 118){
    return false;
    } else if(e.which == 119){
    return false;
    } else if(e.which == 120){
    return false;
    } else if(e.which == 121){
    return false;
    } else if(e.which == 122){
    return false;
    } else if(e.which == 123){
    return false;
    }
    }
    F-Key_Test.story74 KB
ChelseaJohnson-
Community Member
7 years ago
I have never been able to get that code to work when I put it in, but could be user error. However if you want to eliminate using java in your program the storyline 360 is the way to go. All I had to do was create a trigger to jump to the next page when user clicks F5 and its good to go! But it is good to know that it is a possibility to get done in S2!
- BCHarper
  Community Member
  7 years ago
  Chelsea - If the function keys are all working for you with 360, that is amazing! When you publish your files, have you tested this function in Chrome and Internet Explorer? Our learners are split about 50/50 between these two browsers. With what Owen has helped with, it worked on IE, but not in Chrome. Additionally, with the F1 selection, does it open help? I sincerely appreciate any info you can provide on this.
  - OwenHolt
    Super Hero
    7 years ago
    I'm using chrome and it works for me. Cross browser support is always tricky.
    Try this code as an alternative to disable all of the function keys instead of what i listed before and see if you get a better result:
    
    document.onkeydown = function (e) {
    var key = e.charCode || e.keyCode;
    if (key >= 112 && key <= 123) {
    e.preventDefault();
    } else {
    // non function key so do nothing
    }
    }
    
    See attached SL2 file with alternate code.
    
    F-Key_Test_V2.story81 KB
eLearningmLearn
Community Member
12 years ago

Has anyone came across with this?

Thanks.
taramoore4
Community Member
12 years ago
I have come across it at the same point you are now....I need to create the computer simulation, but don't know anything about javascript and Storyline. Did you get a solution somehow?
BCHarper
Community Member
10 years ago
Just saw this post... Did this actually work for you in the past? I have a similar situation and we have been trying to work around with a virtual keyboard but it is just not realistic for our learners...
KarelWagner
Community Member
10 years ago
This community is so AWESOME!!

I had no idea why my simulation would not advance when I'd press 'F2'. I had my trigger correct but it would not work. The advise provided by Lynn Stocks worked like a charm.

NOTE: I'm not experienced with JaveScript either.

Thank you Lynn!
SadieGunnink
Community Member
9 years ago
Just helped a colleague with this very issue and Lynn's suggestion worked like a charm. Thank you! Thank you!! :)
- davidtempleton
  Community Member
  7 years ago
  Where do you enter this script? I am not fully understanding.
KarenOpperman-6
Community Member
9 years ago
It works! Thanks Lynn. :)

Just a note: if you want to test it, publish to CD format for quickest results.