Skip to main content
L
L_A_G
Known Participant
January 16, 2014
Question

Max height with scalable HTML?

  • January 16, 2014
  • 2 replies
  • 2599 views

Hi,

In the past, we have always published (and created) in 800x600 because it was the best for the screen in our computer labs. We had some request to see them on smaller devices. That's fine, we thought, just have to use "scalable html"... But now, when we publish, the projects aren't 800x600, they are really too big and really blurry on our normal screens. Is there a way to avoid that problem? Like having a max height, but no min height?

Thanks,

Laurie-Anne

    This topic has been closed for replies.

    2 replies

    X
    xswqazi09
    Known Participant
    September 21, 2014

    Hi all,

    I'm having the same problem, really don't want the screen to upscale as this makes everything blurry but need it to downscale to smaller sizes. I'm using Captivate 8, has anyone managed to solve this problem?

    Thanks for your help!

    TLCMediaDesign
    TLCMediaDesign
    Inspiring
    September 22, 2014

    In the head <script> section of the index.html, place a detections script:

    var isMobile;

    if( /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent) )

    {

      isMobile = true;

    }

    else

    {

      isMobile = false;

    }

    Then in the CPM.js find:

    cp.shouldScale = cp.D.project.shc;

    and replace with:

    if(isMobile)

    {

       cp.shouldScale = cp.D.project.shc;

    }

      else

    {

       cp.shouldScale = false;

    }

    This code stops the project from scaling up if not in a mobile device for HTML5 output.

    S
    Sreekanth_S
    Legend
    January 16, 2014

    What is the captivate verison you are using?

    When you create and publish the course with 800 x 600, that is the maximum dimension it takes.

    What kind of content is lookng blurry? Can you check the zoom settings on the browser? Reset it to 100% and test it once. Perhaps a screenshot would help.

    Sreekanth

    L
    L_A_GAuthor
    Known Participant
    January 16, 2014

    Hi!

    - I'm using Captivate 6

    - Everything looks blurry (Images, text, playbar, etc.)

    - My browser is at 100%. But, since the project always takes 100% of the page, nothing changes when I set it to 90%, 110% or 100%.

    TLCMediaDesign
    TLCMediaDesign
    Inspiring
    January 16, 2014

    Look in the published captivate.css file.

    Change this:

    #CaptivateContent {

    text-align:center;

    }

    To This:

    #CaptivateContent {

    text-align:center;

    max-height:600px

    }

    Terms & ConditionsAccessibility statement
    Using the community Terms of use Privacy Cookie preferences Do not sell or share my personal information ad choicesAdChoices