• Global community
    • Language:
      • Deutsch
      • English
      • Español
      • Français
      • Português
  • 日本語コミュニティ
    Dedicated community for Japanese speakers
  • 한국 커뮤니티
    Dedicated community for Korean speakers
Exit
1

Full Screen toggle button in Captivate??

Community Beginner ,
Dec 06, 2012 Dec 06, 2012

Copy link to clipboard

Copied

Is there ANY way to create a full screen toggle button in captivate? I've tried everything I can think of. I am creating an interactive training product that I would like for users to switch to "full screen mode" if they wish (both html5 and flash). Is this possible??

TOPICS
Advanced , Advanced actions , Editing

Views

5.0K

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Beginner ,
Jan 28, 2017 Jan 28, 2017

Copy link to clipboard

Copied

you can execute  javascript codes:

//【fullscreen】

var docElm = document.documentElement;

//W3C 

if (docElm.requestFullscreen) { 

    docElm.requestFullscreen(); 

}

//FireFox 

else if (docElm.mozRequestFullScreen) { 

    docElm.mozRequestFullScreen(); 

}

//Chrome等 

else if (docElm.webkitRequestFullScreen) { 

docElm.webkitRequestFullScreen(); 

}

//IE11

else if (elem.msRequestFullscreen) {

  elem.msRequestFullscreen();

}

//【exit fullscreen】

if (document.exitFullscreen) { 
        
document.exitFullscreen(); 

else if (document.mozCancelFullScreen) { 
        
document.mozCancelFullScreen(); 

else if (document.webkitCancelFullScreen) { 
    
document.webkitCancelFullScreen(); 
}
else if (document.msExitFullscreen) {
      
document.msExitFullscreen();
}

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Contributor ,
Jan 30, 2017 Jan 30, 2017

Copy link to clipboard

Copied

In the case where you are displaying your materials in an IFRAME of an LMS,  you need to use this instead:

// check to see if you're in an iframe

let i = parent.document.getElementsByTagName("iframe")[0]

        if (i == null) { 

            i = document.getElementById("main_container")   // nope, you're ok..  main_container is from captivate.

        }

        i.webkitRequestFullScreen()   // assuming this works for more than chrome.

    });

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Explorer ,
Feb 27, 2017 Feb 27, 2017

Copy link to clipboard

Copied

Hello Zensoft, 

I try to add this 2 button in my project in order to switch between fullscreen and window mode. 

I never use "javascrip" command, it s new for me

I add your command line in my action like you can see in my cap.

But nothing happend, when I test or publish my project in exe file for example.

 

Could you help me ?

Thank you.

 

Best regards,

 

Chris 

 

1 2 3 4

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Contributor ,
Aug 17, 2017 Aug 17, 2017

Copy link to clipboard

Copied

The JavaScript based solutions will need the project to run on a browser, and as I can see, you are publishing EXE so these will not work for you. For that publish the project as HTML5.

/best

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Aug 18, 2017 Aug 18, 2017

Copy link to clipboard

Copied

Pulbishing to exe means you are using SWF output, do you realize that?

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Explorer ,
Aug 18, 2017 Aug 18, 2017

Copy link to clipboard

Copied

Hi all ! 

Since my post, I succed to use this widget in using Html Publish mode, that's true. 

But the widget seems to work only with the version 9th of Adobe Captivate ! 

 

Thanks for this technical highlight. 

Best regards,

Chris

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Aug 18, 2017 Aug 18, 2017

Copy link to clipboard

Copied

Hmmm, not with 2017? I will leave you to the JS experts in that case.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
People's Champ ,
Aug 22, 2017 Aug 22, 2017

Copy link to clipboard

Copied

There is an error in the code you used for IE. I also would NOT use the comments in the code. Try this:

This is for the "FULL_SCREEN ON" button:

var docElm = document.documentElement;

if (docElm.requestFullscreen)
{
docElm.requestFullscreen();
}
else if (docElm.mozRequestFullScreen)
{
docElm.mozRequestFullScreen();
}
else if (docElm.webkitRequestFullScreen)

docElm.webkitRequestFullScreen();
}
else if (docElm.msRequestFullscreen)
{
docElm.msRequestFullscreen();
}

This is for the "WINDOW" button:

if (document.exitFullscreen)
{         
document.exitFullscreen();
}
else if(document.mozCancelFullScreen)
{    
document.mozCancelFullScreen();
}
else if(document.webkitCancelFullScreen)
{
document.webkitCancelFullScreen();
}
else if(document.msExitFullscreen)
{
document.msExitFullscreen();
}

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Explorer ,
Aug 22, 2017 Aug 22, 2017

Copy link to clipboard

Copied

Hi David,

 

Thank's that s working now with the right code

 

Regards,

 

Chris

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Beginner ,
Dec 14, 2017 Dec 14, 2017

Copy link to clipboard

Copied

Hi TLCMediaDesign,

thanks for this code

But is there also a solution for iPad and iPhone? Doesn't seem to work for this devices.

Greetings

Flo

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
People's Champ ,
Dec 14, 2017 Dec 14, 2017

Copy link to clipboard

Copied

Do you have it attached to a button. You can't just execute the code. I don't have my code with me at the moment, it's on another computer. I'll try and remember to post it tonight.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Beginner ,
Dec 14, 2017 Dec 14, 2017

Copy link to clipboard

Copied

Yes, it's attached to a button. If I press the button the project goes into fullscreen mode (without forcing landscape mode). But this only works for Desktop and android.

Greetings and thanks in advance

Flo

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Explorer ,
Jun 11, 2020 Jun 11, 2020

Copy link to clipboard

Copied

LATEST

Hello thank you. I just tested the script, it works. Do you know how to remove the full screen button in full screen mode, then only make the button appear to exit full screen? Thanks for your help.

 

Sorry for my English. I used Google Translate

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Resources
Help resources