Dynamically fit to Browser window

approg
approg Community Member Posts: 250 ♪ Opening Act ♪
Some of the people I work with have spent a fair bit of time getting Lectora, when published to HTML5, to dynamically fill the entire browser window. The aspect ratio of the title is maintained so you get letter-boxing if the browser window and the title proportions don't match.

If you make the browser window small enough the text/content gets too small to read but if you are using Lectora 17 and seamless publish mode you can include a "full screen" button in the UI and the course grows to fill the entire screen (like making the full screen button on an MP4).

Attached is a screen movie of what it looks like.

It looks pretty neat to me but I don't know if it's worth hassling them to document and release what they've done. Anyone like to comment?

Comments

  • jvalley4735
    jvalley4735 Community Member Posts: 1,357
    Following
  • approg
    approg Community Member Posts: 250 ♪ Opening Act ♪
    No replies yet so I've attached another sample showing an RCD title running in ReviewLink.

    Contrary to what the text in the title says, the title does not use the 3rd party JavaScript file screenfull.js nor does it require the user to press the F11 key to go into full screen mode. It's all done with one JavaScript and one tiny CSS file dropped into the top of the title. Nothing else to edit/add/subtract except of course for the full screen/norm buttons which need to call a JavaScript function (the button could be made to toggle full screen on/off but I haven't got around to it yet).

    Anyone?
  • approg
    approg Community Member Posts: 250 ♪ Opening Act ♪
    Here it is

    It's easy to use and works in modern browsers from IE9+.
  • approg
    approg Community Member Posts: 250 ♪ Opening Act ♪
    Today we released version 1.2 which addressed a few issues.
  • andrew-robertson
    andrew-robertson Community Member Posts: 103 ✶ Headliner ✶
    Hi - I am surprised that no one commented on this feature and request for information. Can you elaborate on the code that your developers added in the top portion of the course content? Or have I missed something completely and that this specific feature is now supported in the Lectora 17 application.
    Andrew R.
    Developing content since 2010 using a mixed bag of tools.
  • approg
    approg Community Member Posts: 250 ♪ Opening Act ♪
    For various reasons we're not supplying the code any more.

    Lectora 17 now has a 'scale content to fill window' (and a 'fit content to width') publish option which seems to do similar though I think you need to put in your own 'Go to full screen' control.
  • andrew-robertson
    andrew-robertson Community Member Posts: 103 ✶ Headliner ✶
    Great thank you - I did find it later in the day when playing with the software, but sadly we won't be on 17 for a few more months.
    Andrew R.
    Developing content since 2010 using a mixed bag of tools.
Sign In or Register to comment.

So You Wanna Be An eLearning ROCKSTAR?

We're all fans of eLearning here! Want to become an eLearning ROCKSTAR? Just click on one of the buttons below to start your rocking journey!