Concluído

SVG Arc Progress bar with constant stroke-dasharray object

Need solution for this question [login to view URL]

Here is my JSfiddle [[login to view URL]] I am trying to make an SVG Arc progress bar with a constant object at the end of the progress bar. When i animate this using JavaScript the constant object is going to the other side when it reach 100%. Otherwise it is working perfectly. Also i found 1 Pixel difference in stroke-dasharray for constant object when using Safari.

1% Progress (Both blue and white object on the left corner)

50% Progress (Both blue and white object on top center)

100% Progress (Both blue and white object on bottom right corner)

Challenge for me i am not able to achieve above screenplay to action perfectly & Browser rendering issues may come along with it.

FCFS if you can come with working solution first the project will be awarded and give you $30 payment instantly. Also i may need your help with SVG,CSS and JS works.

Habilidades: CSS, HTML, HTML5, Javascript, jQuery / Prototype

Veja mais: create file upload script progress bar php, large file upload process progress bar php, upload progress bar script, website design, wordpress, ecommerce, angular.js, laravel, php script file upload progress bar, vbnet progress bar copy, upload progress bar javascript php, php file upload javascript progress bar, php upload progress bar ajax, php upload progress bar, progress bar vbnet, upload progress bar ajax php, upload progress bar php, ajax upload php progress bar, progress bar script, copy folder progress bar

Acerca do Empregador:
( 20 comentários ) Eranakulam, India

ID do Projeto: #17091962

Concedido a:

shaochao555

Hi dear. I did your requirements. Requirements is clean. I'm a web developer. I can give good results. Please discuss with me.

$30 USD em 1 dia
(46 Comentários)
5.0

2 freelancers estão ofertando em média $25 para esse trabalho

atiqprogramer

I have read your project you should change your code as follows this will stop your constant object on RIGHT side:- @keyframes dash { to { stroke-dashoffset: 0; } } TO THIS @keyframes dash { Mais

$20 USD em 1 dia
(0 Comentários)
0.0