Animate canvas line on hover

£20-250 GBP

Completed

Posted

over 6 years ago

£20-250 GBP

Paid on delivery

Here's a jsFiddle of what I've got so far, read below to find out what I'm after: [login to view URL] So I have a function that works on hover, basically when you hover over a `.menu-item` element it'll draw a line from this element to the `.header-logo` element. This works great but I want this line to animate, i.e. grow from the `.header-logo` outwards on each occasion, I've not even got a clue where to start on this one so any suggestions would be great! There's one more thing too, the line appears pixelated, I need this to be a crisp 1px line if possible? I'm completely clueless with canvases so any help on all of the above would be greatly appreciated!

Project ID: 15374112

About the project

28 proposals

Remote project

Active 7 yrs ago

Looking to make some money?

Email address

Benefits of bidding on Freelancer

Set your budget and timeframe

Get paid for your work

Outline your proposal

It's free to sign up and bid on jobs

Awarded to:

@tigrangrig

Hi. I am web developer and I am very good at canvas and animations. You can see an example of my canvas work in my portfolio. I know how to animate the line you want and I think I can fix it's pixels Relevant Skills and Experience JavaScript, Canvas, HTML5 Proposed Milestones £30 GBP - Project milestone

£30 GBP in 0 day

5.0

(12 reviews)

3.5

28 freelancers are bidding on average £157 GBP for this job

@dizajnerweb

Hello there. I've seen jsfiddle link. We can change anything according to your wishes. Contact me for more information. Relevant Skills and Experience js Proposed Milestones £90 GBP - done

£90 GBP in 0 day

5.0

(502 reviews)

8.3

@DevelopersHouse

Hi, its pretty simple for me but I have few questions to ask, knock me for further discussion, PLEASE DON'T AWARD PROJECT BEFORE DISCUSSION. Thank You! Relevant Skills and Experience css, html, html5. js etc Proposed Milestones £75 GBP - 50% to start work £75 GBP - 50% after completing work

£150 GBP in 3 days

4.9

(201 reviews)

7.9

@finbuks

Greeting of the day! Coming directly to the point... I have gone through your requirements that you have a function that works on hover, basically when hovering over a `.menu-item` element it'll draw a line from this element to the `.header-logo` element. This works great but you want this line to animate, i.e. growing from the `.header-logo` outwards on each occasion. I would like to let you intimate that I am very EFFICIENT, ETHICAL and EXCELLENT (EEE) to do this kind of work. Looking forward for your quick and early reply. Thank you, Nisha

£160 GBP in 7 days

4.8

(138 reviews)

7.5

@topithub

I have read your job description and I can say that I am really good fit for this job. Relevant Skills and Experience Hi sir/madam, I am an expert web programmer with more than 6 years’ experience in latest web development technologies Proposed Milestones £150 GBP - task I’m ready for chatting.

£150 GBP in 3 days

5.0

(38 reviews)

6.8

@liangjongai

I am Pang, web and app developer.I am interesting in your task. I will give you comfortable and cheap service and finish your task on time. Please give a chance!!! Stay tuned, I'm still working on this proposal.

£150 GBP in 3 days

4.7

(115 reviews)

6.9

@fashionsoft

Hello Sir, I have just read your project description and understood all the basic requirements mentioned in there as I have more than 10 years of experience in this field. So can we please discuss more now to get started quickly? I am waiting for your valuable feedback. Please Sir, don't worry with the price now as you are going to get a great result for this price. So please let me know if we can have a quick chat now to move forward. Moreover, I can be part of your dedicated team to build your dream. So you just need to give me a little opportunity to get started. Thanks, Sumon

£250 GBP in 7 days

4.8

(60 reviews)

6.4

@mattsrinc

Hi, my name is Matt and can help with smoothly animating lines between your elements on a web page. There are several methods - I would go for SVG and adding one javascript for several reasons. Relevant Skills and Experience 23 years an IT developer and webmaster. Web animations/visualizations work for 5+ years, mostly with HTML5, SVG and javascript (GreenSock library). Proposed Milestones £140 GBP - Custom animation script Please reply regarding usage of an SVG overlay/javascript library that would simplify all. Matt

£140 GBP in 2 days

4.9

(63 reviews)

6.3

@dragondance

Hi, making the line animate is pretty simple. Basically, we need to draw the line many times, each time it's longer than last time. The pixelated issue is hard to solve. It's just a browser thing. You can either increase the stroke width or make sure the "line angle" is not too small. Relevant Skills and Experience jQuery, HTML5, CSS Proposed Milestones £70 GBP - On completion

£70 GBP in 1 day

4.9

(93 reviews)

6.0

@shoppingsamrat

Hello Sir, I am Amit Singhania, Web Developer Experience More than 7 Years. We are a leading Web Designing, Development, Mobile Application & digital marketing agency. We gone through your requirement Relevant Skills and Experience We provide diversified services at global level in variety of fields like. •Unique logo, Web & Graphic Designing. •Web Development •Mobile Development. •Digital Marketing Proposed Milestones £150 GBP - For the Milestone payment Initial draft.

£150 GBP in 3 days

0.0

(0 reviews)

0.0

@girisuman98

I can full fill your requirements. Relevant Skills and Experience CSS, HTML, HTML5, Javascript, jQuery / Prototype Proposed Milestones £150 GBP - NA

£150 GBP in 3 days

0.0

(0 reviews)

0.0

@junaidmir527

Hi, I am interested in your project and I would like to know more details. Kindly drop a message so we can discuss. Good luck!

£100 GBP in 5 days

0.0

(0 reviews)

0.0

@csekabir69

Hello Sir! I read carefully and understood your work. I think I'm a great fit for this project because I have an interest in your project and can deliver on time, according to your expectation. Relevant Skills and Experience I have 2 years experience.I worked a company last 2 years as a Web Developer.I am always available on Email and Skype. Please have a voice or video chat if necessary. Proposed Milestones £150 GBP - anyone

£150 GBP in 1 day