Show hide this id?

[Jacob Hokland]

Hi,

I'm building my own subtitles/CC with JS, but something messes up.

When I spread the subtitle objects (smart shapes) along the time line, the code below cannot cope with objects that are not appearing on the moment the a self made subtitle on/off buton has been clicked. So how can I bypass the CP CSS visibility?

$('[id^="Subtitle"]').each(function( index ){
if($( this ).css('visibility') ==='visible')cp.hide(this.id)
else cp.show(this.id);
});

/Jacob

[TLCMediaDesign]

The issue I am having is it throwing a isInRange is not a function error when the button is pressed a second time. Why are you using your own CC? You could always use the built in CC and move it if that's what you are trying to accomplish.

var cc = document.getElementById( 'cc' )
cc.style.width = '1160px';
cc.style.left = "10px";
cc.style.top = "606px";
cc.style.padding = "0px 10px 0px 10px";
document.getElementById("ccClose").style.display = "none";

[Jacob Hokland]

Thanks.

The idea of creating my own subtitles has been to be able to create a semi-transparent background bar (black) and white font as desired.

But what is that with ccClose ID? And where to customize the styling for the entire project? And what if I'm exporting as a scalable project?

/Jacob

Kind regards,

Jacob

[TLCMediaDesign · Accepted solution]

ccClose is the ID of the little X in the top right of the CC, I hide it so my toggle action works.

The background color of the CC is set in a div with the id "ccText"

Scaling doesn't have any effect