Help with classic player
Jan 06, 2021
Hi - I have been using the classic player and colors for a client project for several years without a problem. I noticed today after publishing the content, that there is a faint line wrapping around the inside of the player border. This is a problem, given that the player border should look seamless with the custom navigation bar I created just above the bottom portion (they are the same color).
Any idea what's happening with the player or what I need to do to remove the border/line? I've attached an image below to illustrate. . . .
11 Replies
That is probably a line set by internal CSS from the latest update of Storyline. If you have a sample of a course i might be able to find what part of the CSS causes it and we can change that.
Basically it is this CSS rule i guess in the classic player that gives it that color. Making a sample storyline with the CSS change so you can copy/work from that one to get it right.
To override that particular border in CSS you can either change the CSS code in Storyline, but then you need to do that time after time when publishing or you can use this simple Javascript to change the border to 'none' when showing the course...
Thanks so much Math! I wondered if it was a result of the latest update. . .
I think I can manage the javascript. Can it just be added to one of the slides? does it matter which one?
Thanks!
Stephanie
Probably yes, best to add on the first.
so, the javascript did not work:(. I've attached a sample from the project, would you mind taking a look?
thank you!
oops - didn't include the javascript on the sample, it is included on this one. . . .
double r on querry...should be query and then it works... ;-)
querySelector
I corrected the additional r and still get the same result on the full project . . . ugh
and, when I publish the sample (with the corrected javasript) the line persists. . .
What browser are you testing because in Chrome its fine.
As in fact in IE, Firefox and Edge.... mmm.
Published on Review too...but its fine there too...
https://360.articulate.com/review/content/255e7a5e-ac19-45be-8657-fb5091631e41/review
Adding my testproject so you can see yourself. Not sure what you are doing differently.
Only thing i can think of is that you shouldnot set it on your first page, because '#frame' is not available there.. but hard to tell without seeing the complete project. Do check your console to see if you get error-messages.