섹션3에서 simplyscroll Plugin을 사용해서 사진들이 사선을 흘러가는 갤러리 부분에서 질문드립니다.수업자료로 받은 플러그인도 연결하고 소스도 그래도 넣었지만 요소검사를 했을때 아래 클래스가 붙어있어야 하는데 전혀 붙지가 않아서요,갭처한 코드 이미지를 보고 그대로 몇번을 다시 해봤지만 되질않아서요그 부분까지만 완성한 파일을 받아볼수 있을지요?kwanggony@naver.com.simply-scroll .simply-scroll-clip{}

안녕하세요 선생님. 강의 정말 잘 듣고 있습니다. 다름이 아니라, 가로 스크롤 반응형 제작중갤러리 형태를 세로 방향으로 바꾸는 과정에서 scrollTrigger 를 없애기 위해서 li 를 padding: 0; 으로 바꿔주면 된다고 하셨는데, 저는 적용이 되지 않아 반응형에서도 갤러리들이 가로방향으로 스크롤이 되는 문제가 생깁니다.. 도저히 이유를 모르겠어서 질문 올립니다감사합니다..work { position: relative; height: 100vh; border: 2px solid tomato; } .work ul { display: flex; padding: 3% 30%; box-sizing: border-box; } .work ul li { width: 600px; padding: 100px; box-sizing: border-box; flex-shrink: 0 !important; } @media screen and (max-width: 1024px) { .work { height: auto; } .work ul { padding: 0% 5%; justify-content: space-between; flex-wrap: wrap; } .work ul li { padding: 0; width: 45%; margin-top: 150px; } }

안녕하세요 선생님. 여러번 똑같이 따라 쳐보았으나..markers: true 여도 페이지에 scrollTrigger 표시가 되지 않고, 가로 스크롤이 동작하지 않습니다. console 창에 다른 오류 사항은 뜨지 않습니다. 무엇이 문제인지 전혀 모르겠어서 질문 남깁니다..$(function () { // GSAP Plugin gsap.registerPlugin(ScrollTrigger); ScrollTrigger.matchMedia({ "(min-width: 1024px)": function () { // horizontal scroll let list = gsap.utils.toArray(".work ul li"); let scrollTween = gsap.to(list, { xPercent: -100 * (list.length - 1), ease: "none", scrollTrigger: { trigger: ".work", pin: true, scrub: 1, start: "center center", end: "300%", markers: true, }, }); }, }); });

.project-gallery { display: grid; grid-template-rows: 300px calc(100vh - 600px) 300px; } 100vh 뷰포트 높이로 calc를 사용하게 되면 창 높이가 작아졌을 때 레이아웃이 깨지는데 100%나 calc 가 아닌 1fr 로 사용해야하지 않을까 싶은데 맞을까요?아님 다른 해결책이 있는지도 궁금합니다.

안녕하세요$(function(){ gsap.registerPlugin(ScrollTrigger); ScrollTrigger.matchMedia({ '(min-width: 1024px)': function(){ let list = gsap.utils.toArray('.work ul li'); let scrollTween = gsap.to(list, { xPercent: -100 * (list.length - 1), ease: 'none', ScrollTrigger: { trigger: '.work', pin: true, scrub:1, start: 'center center', end: '300%', markers: true, } }); } }) });현재 여기까지 작성을 하였는데 창 새로고침과 동시에 갤러리 가장 끝쪽으로 넘어가버립니다.콘솔에서는 이렇게 뜨구요,,,markers도 안 보이는 걸 보니 플러그인이 작동되지 않는 것 같은데코드를 전부 똑같이 치고 몇 번을 다시 봤는데도 전혀 안 되네요...파일 첨부를 어떻게 하는지 몰라서 제 코드 파일 다운로드 링크를 함께 올립니다.한번 확인 가능할까요?ㅜㅜhttps://bigfile.mail.naver.com/download?fid=JYbZa6JnM6mraAUjKCY9KqvdHqUmKoEmFAU/KxvqKxg/HquXFA2dFAtqaxvjF6UlazKZaztlF4U/FrpSMoUdaAMqaxI0KrtlKA+oFAb=

서비스 문의 / 문의 내용 * 에서  한글 입력을 해보면 첨부한 그림과 같이 커서 아래에 푸른 _ 가 하나 계속 커서를 따라 다닙니다. 테스트 개발은 문제 없지만, 실제 업무에서는 사용이 불가할 것 같은데요. 해결책이 궁금한데요. 혹시 방법이 있을까요?   

강사님 안녕하세요.gsap강의 소개에 있는 에이전시 합격 포트폴리오는 수강생들 각자 제작한걸까요?아니면 이번 수업중에 있는 내용일까요?너무 잘 만드셔서 참고해서 만들어보고 싶은데 정보를 얻을 수 없을까요.. 문의드립니다.

안녕하세요! 강사님!그리드 레이아웃과 관련되어 질문이 있습니다. 보통 디자이너들은 모바일, 태블릿, 데스크탑을 분리해서 개별적인 그리드 시스템을 활용해서 디자인을 진행하는 것으로 알고있습니다. <div class="container mx-auto"> <div class="grid grid-cols-4 md:grid-cols-8 lg:grid-cols-12"> <div class="col-span-4"> a </div> <div class="col-span-4"> b </div> <div class="col-span-4"> c </div></div></div> 이런식으로 각 섹션마다 container mx-auto로 컨테이너를 생성해주고 내부 row를 grid-cols로 그리드화하고 그리드 레이아웃에 맞게 컬럼들을 확보해서 하는 방식은 실제로는 잘 사용되지 않는 방법일까요 ?! 여러 군데를 찾아보아도 실제 grid를 사용하는 곳은 카드 UI들을 동일한 간격으로 배치하는 구조로만 사용하더라구요!

크루알라모드 강의수강 했는데자료 다운 받아보니 안에 내용이 없습니다자료요청 드려용rkgml6255@naver.com

섹션7 강의에서 스크롤관련 소스에서 정확히 알고자 질문드립니다아래 부분에서 $.fn 은 무슨 뜻인지요?표현식함수로 만든건 알겠는데 앞에 부분을 삭제하니 실행이 안되더라구요, $.fn.scrollMoving= function(){ let elementTop = $(this).offset().top; //선택한 요소의 Y축 좌표값 let elementBottom = elementTop + $(this).outerHeight();//Y축 좌표값+현재요소의 높이값 let viewportTop = $(window).scrollTop();//화면의 스크롤값 let viewportBottom = viewportTop + $(window).height();//스크롤값+화면의 높이 return (viewportTop < elementBottom) && (elementTop < viewportBottom) //들어오는 시점과 나가는 시점을 알아냄 };

안녕하세요.선생님께서 제공해주신 피그마 화일에서움직이는 아이콘을 확대해도이미지가 깨지지 않습니다.방법을 알려 주실 수 있을까요?질문이 많은데, 친절히 설명해주셔서 감사합니다.답변을 기다리겠습니다. 감사합니다.

안녕하세요. 선생님섹션 8 강의: con02영역_인터렉티브 모션 : Gsap ScrollTrigger를 활용한 워크리스트제작에서 'My Work' 텍스트를 스크롤할 때 고정시키고 아래 .workList 영역에게 margin-top을 줘서 자연스럽게 스크롤 되도록 설정해주셨는데,스크롤 밑으로 내릴 때는 자연스러워보여도 스크롤을 위로 다시 올릴 때 'My Work' 애니메이션이 위영역과 겹친다거나, 부자연스러운데... 이부분은 어떻게 해결해야 되나요? 그리고 타이틀영역을 positon: sticky로 적용하는 방법은 없을까요?

안녕하세요. 위의 이미지에 질문을 넣었습니다.강의명은 UIUX 포트폴리오 Part.3 - 반응형 웹 포트폴리오 입니다.답변 부탁드립니다. 감사합니다.

"UIUX 포트폴리오 Part.3 - 반응형 웹 포트폴리오" 강의에서"섹션2"에 있는 일러스트의 "gif 애니메이션"을 어떻게 만드셨는지 알려주실 수 있을까요?유투브, 구글, 네이버에서 관련 강의를 찾아봤는데, 못 찾았어요.만약 관련 강의를 아신다면, 알려주셔도 될 것 같습니다.답변 주세요. 감사합니다.

html안에 style에 정의된 apply 코드들은 cdn으로 링크된 tailwindcss 스크립트가 tailwindcss 스타일로 인식해 실시간으로 빌드하여 적용되지만 외부 스타일로 링크하면 일반 css로 인식해서 빌드하지 못하기 때문에 적용되지 않는다고 하네요그래서 cli로 빌드해서 적용해야 한다고 합니다

XD다운이 지금 안되는거 같은데 어떻게 할까요..

안녕하세요."UIUX 포트폴리오 Part.3 - 반응형 웹 포트폴리오" 강의를 재밌게 보고 있습니다."완성" 폴더에 "원본"폴더에 있는 "yeskey"에 들어간 움직이는 이미지들을, 이미지 사이트에서 다운로드 받으신걸까요?만약 그렇다면 다운 받으신 사이트의 주소를 알려주실 수 있을까요?제 이메일 주소를 남깁니다. happinessboom@daum.net 입니다.좋은 강의를 만들어 주셔서 감사합니다.

강의에 대한 질문은 인프런 질문하기나, 1:1 커뮤니티 페이지에서 문의하시면 빠르게 답변 드리고 있습니다.(커뮤니티 주소 https://itconnect.dev/커뮤니티/) 인프런 서비스 운영 관련 문의는 1:1 문의하기를 이용해주세요테마 파일과 CSS, PHP 파일은 아래 링크를 통해 받아보실 수 있습니다.https://drive.google.com/drive/folders/1KtkfsZe2uy5jNMps0F6gnqlEvZnq0mRN?usp=sharin푸터를 영상에 나온것처럼 변경했는데 새로고침하면 배경색 글자색 지정한거 없어지고 위에 같이 보이네요 ㅜh1글자색으로 보여지는 것같아요 해결방법있을까요?

죄송하지만 질문하실 때 React 또는 Vue와 같은 자바스크립트 프레임워크에서 Tailwind CSS 설치 및 사용에 관한 질문은 하지 말아주세요. 질문하셔도 React 또는 Vue 환경을 몰라서 답변을 드릴 수가 없습니다. 오직 순수한 Tailwind CSS 관련 질문과 CSS 속성 및 활용에 관한 질문만 해주시면 감사드리겠습니다. 강의명 : 반응형 레이아웃 - Responsive Design Container 과 Responsive Design 차이가 아래가 맞을까여? Container: 전체적으로 반응형으로 설정 Responsive Design : 선언한 엘리먼트 기으로 (국소적으로) 레이아웃을 세세하게 컨트롤 한다   

GP 테마에서 메인 페이지 직접 제작하는 방법 강의를 수강중인데 현재 강의에서 나오는 QUERY LOOP나 POST TEMPLATE 이 제 테마에서는 나오질 않습니다. 이에 따라 강의에서 진행되는 내용을 이어갈수가 없는데 어떤 차이인지요? 아무리해도 POST TEMPLATE을 찾을수가 없습니다.[제 화면 캡쳐]