Embedding story.html into another HTML file via iframe (jumping)

Hi everyone,

We are currently embedding some Storyline objects into other HTML files by using a simple iframe tag.

This works very well for inserting the Storyline interaction inline, exactly where we want it to appear. 

However, when the parent HTML file loads in Internet Explorer 9 (likely other IE versions, too) we're noticing that the page jumps down to where the iframe content is located. It seems as if IE brings focus to the story.html file. This is not what we want to have happen. We want the page to always load at the top of the browser.

The problem appears to be with something in the story.html file itself (perhaps some of the JavaScript) because when we insert other HTML files using an iframe, this jump/focus behavior does not occur. 

Has anyone experienced this or know how to fix the issue?  Happy to share a URL if you send me a private message. 

Thank you,

Kevin

11 Replies
Kevin Thompson

Hi Gerry & Karen,

I recorded a Screenr for the Articulate support folks last week that showed how IE jumps the page down to bring focus to the iframed Storyline content.

The support person was able to replicate the issue. So they said they were going to look into it further and get back to me. 

Gerry, I'll send you a PM of the Screenr, since it is focused on content that hasn't been released yet. 

Kevin Thompson

We received the following from Articulate support regarding what can be done to prevent IE from jumping the page down to a Storyline object that has been embedded in a longer HTML page with an iFrame.  We have commented out the code mentioned below in the story.js file, and tested in multiple browsers, with successful results.

--------------

This is caused by code to make keyboard commands function properly without needing to click on the swf. To disable this feature, you can comment out the following code in story.js: 

case "BW_RestoreFocus": 

var oPlayer = GetPlayer(); 

try 

oPlayer.tabIndex = 0; 

oPlayer.focus(); 

catch (e) 

break;" 

Kevin Metz

Hi, I know this is an old thread, but the code has changed to this is in the story.js file. The section of code to now comment out is as follows:

function SetPlayerFocus()
{
 var oPlayer = GetPlayer();

 try
 {
  oPlayer.tabIndex = 1;
  oPlayer.focus();
 }
 catch (e)
 {
 }
}

 

Thanks, hope someone finds this helpful