A few ways to get this done. First you could use a variable to hold the color. Then on loading/showing the new page you could change that variable with your new color and then it will change. However to create a smooth color transition you also need a way to make the page transition triggered smooth. Might be possible by using Storyline's page transitions. My curious mind is triggered now, so experimenting with it.
That's pretty much the point I am at. I have a trigger to run JS when a slide starts, so I can get the colours I desire on each slide. But the fade is holding me back.
The in-built transition works fine for everything contained within the slide but not for the background browser colour. Will reply here if I crack it....
A solution might be this. Delay page jump...first change color of background of current page. Then go to the next page... and as the background color of that page is the 2nd color... it will look as if it was a smooth transition.
whaaaa Russell you have nailed it! Perfect, thank you so much!
Simple if you know how! Really appreciate this, think being able to manipulate the background colour opens up so many possibilities when used with a frameless player. Cheers!
6 Replies
A few ways to get this done. First you could use a variable to hold the color. Then on loading/showing the new page you could change that variable with your new color and then it will change. However to create a smooth color transition you also need a way to make the page transition triggered smooth. Might be possible by using Storyline's page transitions. My curious mind is triggered now, so experimenting with it.
Hey Math! Thanks for replying!
That's pretty much the point I am at. I have a trigger to run JS when a slide starts, so I can get the colours I desire on each slide. But the fade is holding me back.
The in-built transition works fine for everything contained within the slide but not for the background browser colour. Will reply here if I crack it....
A solution might be this.
Delay page jump...first change color of background of current page. Then go to the next page... and as the background color of that page is the 2nd color... it will look as if it was a smooth transition.
Try using this javascript.
document.body.style.transition = "background 2s";
document.body.style.background = "#0000ff";
Simple and nice effect.
whaaaa Russell you have nailed it! Perfect, thank you so much!
Simple if you know how! Really appreciate this, think being able to manipulate the background colour opens up so many possibilities when used with a frameless player. Cheers!