[Main.js 적용내용 강의] 질문.

Question

pinB & pinC같은경우는, sticky-elem desc-message의 하위속성인데요.

...

그래서 sticky-elem desc-message b 의 태그에 대해서 js로 opacity를 정해주면 desc-message b 뿐만아니라 pin까지 opacity가 조정되더라구요. 근데 완성코드와 강의영상에는 (1) 메세지에대한 opacity정보와 messageB_opacity_in: [0, 1, { start: 0.6, end: 0.65 }] (2) 추가적으로 pinB에 대한 opacity값까지 설정하고 조정하시던데.. pinB_opacity_in: [0, 1, { start: 0.6, end: 0.65 }], 이렇게하는 특별한 이유가 있을까요? +) 또 opacity속성에 scaleY로 된 값을 넣어주는 특별한 이유가 있을까요? objs.pinC.style.opacity = `scaleY(${calcValues(values.pinC_opacity_in, currentYOffset)})`; 감사합니다.

1분코딩 · Answer

아- 이 부분은 몇번 수정하다보니 코드에 잘못된 부분이 들어갔네요; opacity에 scaleY를 설정한 부분은 제 실수입니다^^;; 저렇게 무용지물인 값을 넣게 되면 따로 에러가 나는 것은 아니고, 그냥 아무일도 일어나지 않습니다. 얼른 수정해두도록 하겠습니다! 말씀대로 opacity는 pin들이 따로 동작해야하는게 아니라면 message에만 설정해주시면 되고, 좀 다른 느낌으로 따로 진행되어야 하면 따로 해주시면 됩니다. 이 예제랑 똑같이 만든다기보다, 어떤 의도로 값을 넣었는지만 파악해주시면 될 것 같습니다^^ 오류인 부분을 알려주셔서 감사합니다!! 예제가 좀 복잡하다보니 이런 부분이 조금씩 있네요^^;;; 말씀대로 여기서 pin은 이런 식으로  transform만 조정해주면 되겠네요! if (scrollRatio <= 0.93) { // in objs.messageC.style.transform = `translate3d(0, ${calcValues(values.messageC_translateY_in, currentYOffset)}%, 0)`; objs.messageC.style.opacity = calcValues(values.messageC_opacity_in, currentYOffset); objs.pinC.style.transform = `scaleY(${calcValues(values.pinC_scaleY, currentYOffset)})`; } else {