SVG animation - dynamic symbol onClick fetch/populate element - GSAP DRAWSVG

$10-30 CAD

종료됨

게시됨

5년 이상 전

$10-30 CAD

제출할때 지불됩니다

I have a complex SVG i want to use for my portfolio. There are 2 SVGS, one for BEGINNER WEBSITES and one for ADVANCE WEBSITES. Each of the SVGs are separated into two categories, eclipse symbols, and line paths. What I want is for the DRAWSVG script to select a random line paths and randomly draw from point 0 to point 100% then undraw from point 0 to point 100%, then reverse after a random delay or vice versa. Second I want the eclipses to scale in size when hovered over with the mouse cursor. When the use clicks on the symbol for the eclipse it should assign a random portfolio item to that symbol for an extended period of time while populating the portfolio-box with the image of the website design. Keep in mind there are two categories of portfolios... BEGINNER and ADVANCED. Portfolio items should be only displayed based on the category they belong to. I dont want the pictures to be loaded on document load. I want them fetched upon clicking on symbol eclipse and displayed in the element identified by the ID i will disclose to you. If you do a great job we will add more functionality to this and we can work more in the future. Time to deployment and cost are factors for this project. other projects will not have both the same constraints.

프로젝트 ID: 18135075

프로젝트 정보

4 제안서

원격근무 프로젝트

활동 중 5년 전

돈을 좀 벌 생각이십니까?

이메일 주소

프리랜서 입찰의 이점

예산 및 기간 설정

작업 결과에 대한 급여 수급

제안의 개요를 자세히 쓰세요

무료로 프로젝트에 신청하고 입찰할 수 있습니다

4 이 프로젝트에 프리랜서들의 평균 입찰은 $269 CAD입니다.

@mattsrinc

(bid changed to reflect real 2-day investment to this) Hi, there, Matt Sergej here and I can create your desired visualization (24 years a webmaster, 5+ years scripting web animations/charts/visualizations). I understand what you need and can script this for you. It requires a day though (my daily rate is 150 USD). There are several details that such visualization needs: 1. Not mixing SVG and HTML objects. Recommending to have SVG image in the DIV with all precalculated paths in the SVG (that need to be animated "progressively"). And the DIV displayed with proportional dimensions to SVG that would fit in the DIV 100% etc. 2. No issues with images and other data of websites defined in an array. Yes, images can load on demand, with a script fetching them and display in your mentioned portfolio box. 3. Other than lines and circles all other should be regular web page elements (popup window, HTML markup, no SVG image tag etc). Do explain about the paths more, please. I understand a random path should be highlighted and drawn progressively so that involves several paths between circles. Here the lines must be defined well e.g. starting and ending points - and a logic to choose them. Since javascript is needed either way I would use GreenSock library and its DrawSVG plugin that can display progressive path animation easily. For proof of skills, I can provide links tomorrow (UPDATED: sent in privat chat). Your project can be done (UPDATED) this week. Best Regards, Matt

$250 CAD 2일에