Jump to content
Sign in to follow this  
onurb

[Resolvido] SVG encrava safari

Recommended Posts

onurb

Boa tarde,

estou a criar um site que tem uma pequena animação(SVG) que reage ao scroll . É uma linha que percorre o site enquanto é feito o scroll para baixo. Essa animação é dividida por 14 partes( para poder animar de uma forma mais independente). O que me está acontecer é que a path numero 4 e a path numero 12 sempre que estão incluídas no código encravam o site no SAFARI. Quando as retiro já abre o site em safari e a animação funciona.

Obrigado

Deixo aqui o path da 4 e da 12 e, abaixo, deixo uma das paths que funcionam bem.

<path id="linha4"  transform="translate(30,-1000)" style="stroke-linecap: round; stroke-linejoin: round;" fill="none" stroke="#000000" stroke-width="6"d="M452.005,1358.611
c25.165,33.317,70.92,82.93,118,72c40.264-9.348,59.062-73.568,9.222-62.127c-57.064,13.104-63.104,65.359-34.222,110.127
c-3.307-5.119,53.495,80.827,34,53"/>

<path id="linha12" transform="translate(30,-1000)" style="stroke-linecap: round; stroke-linejoin: round;" fill="none" stroke="#000000" stroke-width="2" d="M203.5,2334.75c0,0-1.5-8-9-4.25
s-9.5,25-2.5,27.75s9.75,1.5,12.25-1s4.5-7.25,4.5-7.25s0.942-6.014,3.098-5.132s2.402,3.382,4.152,3.382s4.5-4.5,4.5-4.5
s2,1.75,2,5.75s-0.646,2.852-0.646,2.852s0.146-9.102,1.396-9.852s2.25,0.25,2.75,4.25s2.272,5.718,3.888,2.481
c1.613-3.231,4.753-7.825,6.683-14.028c1.933-6.203,1.432-13.703-0.568-14.953s-5.521-2.728-5.135,6.14
c0.385,8.862,2.135,36.11,2.135,36.11s4.5,0,3.75-7.75s-2.75-10.5-2.75-10.5s0.934,1.334,4.217,0.043
c3.283-1.293,3.533-3.543,4.283-5.543s-1.894,4.082,0.055,5.291s7.529-4.457,8.279-7.539c0.75-3.084-2-3.084-0.583-2.75
c1.417,0.332,4,0.25,4,0.25s0.75,1.916,1,4.416s0.75,3.5,1.833,2.916c1.083-0.582,1.833-0.834,3-3.5s3.083-5.248,3.417-5.666
c0.334-0.416,1.417-1.916,1.5,1.834s0.167,6.832,0.167,6.832s0.417-9.332,1.333-9.832s2-2.25,2.333,1.25s0.607,7.668,0.607,7.668
s-0.523-9.418,0.893-10.252s2.416-1.584,2.833,2.416s0.334,6.418,2.167,4.584s3.5-4.25,3.5-4.25s0.667-5.25,2.75-5.584
c2.083-0.332,3.417-0.332,3.417-0.332l0.333-1.834c0,0-0.084,8.082,0.833,8.916s1.75,1.25,2.917-1.082
c1.167-2.334,1.833-2.918,1.833-2.918 M278.834,2332.418c0,0,2.916,7.334,6.583-0.084 M297.417,2325.252c0,0,1.25-1.334,0-2.168
c-1.25-0.832-5.583,0.418-5.917,3.668c0,0-0.417,3.5,0.5,4s3.5,2.916,6.583-0.584c2.005-2.275,3.518-4.871,4.33-6.405
c0.437-0.823,0.671-1.345,0.67-1.345c0,0,1.667-2.918,3.75-2.5c2.083,0.416,3.583,3.25,2.917,5.25s-2.5,5.584-4.833,3.584
s-2.583-3.572-2.583-3.572 M311.084,2323.668c0,0,1.333-0.584,3.25-1.5
s4.5-0.334,4.75-2.5s-6.583-1.416-5.083,2.166c1.5,3.584,2.583,4.834,4.667,3.5c2.084-1.332,2.75-1.332,3.75-5
c1-3.666,1.75-6.416,1.75-6.416s4.167,3.25,4.833,6.25s-1.25,4.25-2.667,3.75s-1.667-1.834-1.667-1.834 M208.75,2350c0,0,1.169,4.586,3.002,4.004
c1.833-0.584,2.75-1.002,3.083-3.668s-0.667-4.832-0.667-4.832l-2-0.168c0,0,0.917,1.834,3,2.084 M243.168,2333.502
c0.667-0.332,0.166-0.146,0.166-0.146S242.501,2333.836,243.168,2333.502 M294.251,2332.168c0,0,0.833,2.416,1.5,2.334
c0.667-0.084,3.667-1.25,3.25,0.75s-2.833,2.416-3.083,2.332 M300.417,2316.752c0,0,1.5-1.834,3.75-1
c2.25,0.832,2.333,1.084,3.083,0.166c0.75-0.916,1.167-1.916,1.167-1.916"/>

<---------------------------->

<path id="linha13" transform="translate(30,-1000)" style="stroke-linecap: round; stroke-linejoin: round;" fill="none" stroke="#000000" stroke-width="2" d="M229.419,2391.67
c-4.7,5.26-9.421-3.457-3.375-4.709c3.356-0.693,3.521,4.068,3.53,6.312c0.012,3.552-1.746,4.929-4.989,5.979 M231.783,2385.945
c1.045-0.703,2.09-1.406,3.136-2.107c1.139,3.973,2.275,7.941,3.417,11.916 M244.336,2382.168
c2.73-1.595,6.562-2.07,7.024,2.011c0.323,2.851-2.835,6.739-4.107,9.239c2.541-0.648,5.082-1.304,7.623-1.955 M254.586,2380.336
c0.917-1.025,1.833-2.057,2.75-3.084c1.306,4.111,2.608,8.225,3.917,12.334 M265.002,2377.418
c0.75-0.774,1.5-1.556,2.25-2.332c1.167,3.943,2.333,7.891,3.5,11.832 M276.502,2373.086
c2.73-1.596,6.562-2.071,7.024,2.01c0.323,2.851-2.835,6.74-4.107,9.24c2.541-0.648,5.082-1.305,7.623-1.955 M299.336,2366.418
c2.73-1.595,6.562-2.07,7.024,2.011c0.322,2.851-2.835,6.739-4.107,9.239c2.541-0.648,5.082-1.304,7.623-1.955 M286.502,2371.67c0.75-0.775,1.5-1.557,2.25-2.334
c1.167,3.944,2.333,7.892,3.5,11.834 M309.669,2364.834
c0.75-0.774,1.5-1.556,2.25-2.332c1.167,3.943,2.333,7.891,3.5,11.832"/>

Edited by onurb

Share this post


Link to post
Share on other sites
onurb

Resolvido. Vou a "gerar" o svg no illustrator e funcionou. vai-se lá saber porque xD

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
Sign in to follow this  

×
×
  • Create New...

Important Information

By using this site you accept our Terms of Use and Privacy Policy. We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.