Question / Help Browser Source: transform: scale() not working


New Member
I'm using a Browser source for my overlay in my streams. I've got an animated logo with different animations triggered by javascript. Everything works... except for animations with "transform: scale()". Is this a bug in OBS/CEF or is the person in front of my keyboard responsible? (My animation works in Chrome, Opera and Firefox!)

my animation:
@keyframes vz {
0% {transform: scale(100%); -webkit-transform: scale(100%);}
25% {transform: scale(110%); -webkit-transform: scale(110%);}
40% {transform: scale(0%); -webkit-transform: scale(0%);}
60% {transform: scale(0%); -webkit-transform: scale(0%);}
75% {transform: scale(110%); -webkit-transform: scale(110%);}
100% {transform: scale(100%); -webkit-transform: scale(100%);}


Active Member
Could you post a log? Wondering if OBS will include that failure in there. Kind of doubtful as it's a page rendering thing, but one can hope.

Just as a test, does it work with the decimal equivalent, and without the -webkit- declarations?
@keyframes vz {
        0%   {transform: scale(1);}
        25%  {transform: scale(1.1);}
        40%  {transform: scale(0);}
        60%  {transform: scale(0);}
        75%  {transform: scale(1.1);}
        100% {transform: scale(1);}