본문

[질문] 프로그래밍 코드(JS)를 짜려고 하는데 질문입니다. [13]



글꼴

자바스크립트(JS. 자바 아님)로 프로그래밍을 하려고 하는데요,

제가 미술전공자이고 툴도 프로그래밍 툴이 아닌 전혀 다른 걸 써서 문외한이다보니 간단한 코드조차 못짜고 있네요 ㅠㅜ;;;

 

 

애프터이펙트 라고 하는 영상제작 관련 프로그램인데,

이게 JS를 활용하여 객체나 효과를 일일히 수동으로 지정하지 않고

시간의 흐름에 따라 자동으로 변화 또는 반복을 시킬 수가 있어서

만들어보고 있거든요 ㅎㅎ

(box라는 객체의 position 레이어에서 wiggle (100, 500)을 하면 box가 wiggle에 지정된 값으로 흔들리는 식)

 

 

 

간단하게 그림으로 먼저 설명을 드립니다.

 

 

photo_2020-01-24_03-45-39.jpg

 

 

 

이런 걸 만들고 싶습니다.


 

 

속도를 조절하는 슬라이더 = 슬라1

방향을 설정하는 드롭다운 메뉴 셀렉터 = 셀렉터

조종할 상자 = box

이렇게 지정되었다고 할 때

 

 

위 그림과 같은 조절을 하기 위한 간단한 코드가 어떻게 될까요?


SPEED = time*슬라1이라고 지정한다면

셀렉터 선택값에 맞춰서 셀렉터가 1 (LEFT) 이면 -SPEED, 셀렉터가 2 (RIGHT) 이면 SPEED 값을 "최종결과"라는 것으로 반환해야 합니다.

 

그래서 마지막줄에

[최종결과]

이렇게 끝나면 됩니다.

 

 

 

부탁드립니다.

 

 

 



댓글 | 13
1


jquery 사용하면 아주 간단할 건데 써도되나요?
20.01.24 05:40
루리웹-2009277371
애프터이펙트가 제이쿼리를 안쓰는 거 같아요.. ㅠㅠ 감사합니다 | 20.01.24 14:31 | | |
(1335134)

112.185.***.***

자바스크립트를 써본지가 워낙 오래 되어서 정확하게 코드까지 짜드리진 못하겠지만 나름 생각나는대로만 말로 짜 보자면요 1. slide1이 클릭오프할 때 (마우스 클릭이 떨어질 때) checkupdate. 실행. slide1.on__clickOut(checkUpdate();) //<- 이렇게... checkUpdate(){ if (슬라이드1.value 가 0이 아니면) { moveVar = 슬라이드1.value; if(셀렉터.value 가 1이면) moveVar = -moveVar; box.position.x = box.position.x + moveVar; SPEED = time * moveVar; 문자출력("최종결과 : [SPEED]"); checkUpdate를 time초 후 실행; //<- 시간차는 마음대로. } } 만약 슬라이드를 움직인 직후 외에 셀렉터를 왼쪽 오른쪽 클릭한 직후에도 움직이고 싶다면 똑같은 checkUpdate()를 셀렉터에도 붙여주세요. 셀렉터.on__clickOut(checkUpdate();) 이렇게요... 이런 구조로 짜면 될겁니다.
20.01.24 05:50
Pre-Dec
댓글 이미지 입니다. 이미지를 보려면 여기를 눌러주세요.
웹페이지가 아니다보니 checkUpdate()라는 게 무엇인지 지정해달라고 뜨네요.. 그래서 이렇게 해봤는데 작동이 안되네용 ㅠㅠ 변형으로 아래처럼 해봐도 에러가 뜨고... sld = 슬라이더 a = if(셀렉터===1)(-sld) else if(셀렉터===2)(sld) [값, a] 일반적인 자바스크립트하고 좀 다른가봐요... ㅠㅠ leadingZeros 같은 것도 작동이 안되서 if(입력값<10)["0000"+입력값] else if(입력값<100)["000"+입력값] ... 이런식으로 만들었었거든요.. 여튼 감사합니다. 좀 더 연구해봐야겠어요. | 20.01.24 16:58 | | |
(1335134)

112.185.***.***

여우할아버지
아... 애프터이펙트는 함수를 프로그램 안에서 만들 수 없나보죠?? 뭔가 시원하게 도움 드리고 싶었는데, 그쪽은 저도 전혀 모르는 쪽이예요;;; 대부분 프로그래밍들이 거의 다 그렇지만 이 문제도 다른사람들의 예제를 찾아보시는게 제일 빠를것 같습니다. 거기서 내가 필요한 부분만 남기고 다 지운 다음 추가할거 있으면 추가해서 쓰고.... 대부분 프로그래머들이 그렇게 실력을 쌓아 갑니다. 화이팅하세요~ | 20.01.24 22:30 | | |
Pre-Dec
감사합니다 ㅋㅋㅋ 역시 기존작을 리버스 엔지니어링하면서 이해하는 게 최고군요 ㅎㅎ 감사합니다!! | 20.01.25 00:23 | | |
스크립트로 직접 짜는거보다. 제이쿼리 쓰는게 쉽고 성능도 더 좋습니다.
20.01.24 13:05
루리웹-6942285846
예제요. https://www.everdevel.com/jQuery/animate/ | 20.01.24 13:06 | | |
루리웹-6942285846
제이쿼리 이름만 들어보고 어떤걸까 했었는데 님께서 보여주신 예제를 보니까 쉽게 이해가 되네요 다만 애프터이펙트가 제이쿼리를 안쓰는 거 같아요.. ㅠㅠ 코딩하는 방식이 CSS나 HTML상에서 구현하는 게 아니라 저 JS 엔진 자체만으로 구현해야 하는 거 같아요.. 감사합니다 | 20.01.24 14:35 | | |
(123862)

121.148.***.***

제이쿼리 추천
20.01.24 13:54
수험의제왕
애프터이펙트가 제이쿼리를 안쓰는 거 같아요.. ㅠㅠ 감사합니다 | 20.01.24 14:35 | | |
ㅋㅋㅋ 미치겠다 프로그래밍 기초도 없는 사람한테 다짜고짜 제이쿼리를 추천해주는건 무슨 경우인거야 ㅋㅋㅋ 아무리 좋은 라이브러리라고 해도 기초가 있어야 쓰는거지... 본문에 이미 떡하니 프로그래밍 전공자도 아니고 전용 툴도 아닌걸 쓴다고 적혀 있구만.. 대단하신분들 많네 ㅎㅎ
20.01.24 17:21
(12255)

121.140.***.***

제이쿼리가 애들 다 망쳐놨네 ㅋㅋㅋㅋㅋ 보면 문제의 근본을 읽어보고 조언할 생각안하고 제이쿼리무새 소리하고있음 ㅋㅋㅋㅋㅋㅋ 이래서 바닐라 JS가 각광받지 ㅋㅋ
20.01.24 23:18


1


댓글은 로그인 후 이용 가능합니다.




ID 구분 제목 글쓴이 추천 조회 날짜
7 전체공지 젠지 이스포츠 커뮤니티 오픈! 8[RULIWEB] 2020.02.28
133534 전체공지 섀도우 아레나, 글로벌 3차 CBT 미리 보기 8[RULIWEB] 2020.02.24
30591631 질문 깜뮤비단 74 06:16
30591629 질문 루리웹-9899011281 60 05:10
30591628 질문 루리웹-4905803756 100 02:29
30591627 질문 루리웹-1343525329 84 01:16
30591626 질문 Egosife 176 00:28
30591625 질문 SinisterAnomaly 208 2020.02.28
30591624 질문 후구개통 328 2020.02.28
30591623 질문 쿰쿰파 144 2020.02.28
30591622 질문 Omega Pirate 139 2020.02.28
30591621 질문 음속검 110 2020.02.28
30591617 질문 아아돈리 197 2020.02.28
30591616 질문 ★제리★ 143 2020.02.28
30591615 질문 코로나-70 159 2020.02.28
30591614 질문 루리웹-7422268425 218 2020.02.28
30591613 질문 윤설란 335 2020.02.28
30591612 질문 견고한 무쇠덩어리 144 2020.02.28
30591611 질문 scrub 125 2020.02.28
30591610 질문 꾸잉꾸잉 158 2020.02.28
30591608 질문 루리웹-8973260181 374 2020.02.28
30591607 질문 쥬리오크리스 319 2020.02.28
30591606 질문 신검 1 908 2020.02.28
30591603 질문 닉네임을적기엔여백이모자라다 358 2020.02.28
30591602 질문 교육현실 629 2020.02.28
30591601 질문 루리웹-5338979635 258 2020.02.28
30591600 질문 루리웹-3310466442 484 2020.02.28
30591598 질문 도깨비방망이 711 2020.02.28
30591597 질문 음속검 848 2020.02.28
30591595 질문 루리웹-2208046457 652 2020.02.28

글쓰기 40406개의 글이 있습니다.


1 2 3 4 5 6 7 8 9 10



X