ActivePresenter Saola Animate Pricing Download

How to create a customized Fullscreen Button?


#1

Good Morning everybody,

Is it possible to define a “On Click” action to display the project in Fullscreen Mode? In “Adjust Variable” I cannot find those commands, neither anywhere in the Software Manual. Maybe there exist any useful JavaScript Code which I could use.

Alternatively it would be helpful to hide the progress bar in the Toolbar and to use only the “Display Mode Button”. But i would prefer a customized button, because i dont want to use the toolbar.

Background: We are currently investigating how to embed a project in a website with a header, navigation etc. The project size is to small in this case.

Many thanks in advance.

BR
Marcel


#2

Hasn’t anybody any idea?

Meanwhile I solved it with a workaround. A link on the project view opens a new browser window without any header etc.


(Dao Viet Phuong) #3

Hi,

It requires coding in JavaScript. Basically, you need to add an On Click event to the button, and add an Execute JavaScript action with following code:

var containerElement = prez.container;
if (containerElement.requestFullscreen) {
    containerElement.requestFullscreen();
} else if (containerElement.mozRequestFullScreen) {
    containerElement.mozRequestFullScreen();
} else if (containerElement.webkitRequestFullscreen) {
    containerElement.webkitRequestFullscreen(Element.ALLOW_KEYBOARD_INPUT);
} else if (containerElement.msRequestFullscreen) {
    containerElement.msRequestFullscreen();
}

Regards,


#4

Wow, thanks a lot. That is exactly what i was looking for.

Learning never stops :slight_smile:.


(Alexandre Alves) #5

Hi Dao Viet Phuong!
Your Java Script code for FullScreen is very useful! But a question: How to toggle for non fullscreen in same button? Thanks!!!


(Toan Le) #6

Hi Alexandre,

For latest ActivePresenter version (7.5.2), you can use the following script to toggle fullscreen:

var fsAPI = AP.fullscreen;
if (fsAPI.fullscreenElement())
  fsAPI.exitFullscreen();
else
  fsAPI.requestFullscreen(prez.container);

Regards


(Alexandre Alves) #7

Hi Toan!
Sorry, But I do not have much experience with codes. How could I use this on a button? Thanks for advance


(Toan Le) #8

Hi Alexandre,

You can follow @phuongdv’s answer, just replace the code in Execute JavaScript action by this new code.

Regards


(Alexandre Alves) #9

Thanks Toan!

I was able to use this function. I hope it helps others!

best regards,

fullscreen.approj (200 KB)