Clip-path works in css, but doesn't work in JS (safari problem)

Asked Jan 07 '19 at 20:43

Active Jan 11 '19 at 05:55

Viewed 282 times

I used clip-path property to clip picture, and I did this:

CSS:

-webkit-clip-path: polygon(40% 100%, 100% 100%, 100%  10%); 
 clip-path: polygon(40% 100%, 100% 100%, 100%  10%);

JS:

x.style.WebkitClipPath = 'polygon(0% 100%,  0 0, 80% 0)';
x.style.clipPath = 'polygon(0% 100%,  0 0, 80% 0)';

Result is that, transition and CSS propery works in chrome, firefox, opera. But for safari, it works only CSS file, transition onmouseover doesn't work.

I wouldn't ask If I have to, I spent 2-3 days to find a solution. Tnx in advance people.

edited Jan 11 '19 at 05:55

Ali

2,702
3
32
54

asked Jan 07 '19 at 20:43

Dukela

This? https://stackoverflow.com/questions/41860477/why-doesnt-css-clip-path-with-svg-work-in-safari – Diodeus - James MacFarlane Jan 07 '19 at 20:49
I will try that and tnx, but is it work with transition property? I want to change shape onmouseover. – Dukela Jan 07 '19 at 20:52

Clip-path works in css, but doesn't work in JS (safari problem)

0 Answers0