173만명의 커뮤니티!! 함께 토론해봐요.
미해결
반응형 웹사이트 포트폴리오(App Official Landing Website)
아래 처럼 css 적용하고 html도 강의데로 넣어줬는데... 왜 애니메이션이 적용되지 않을까요 .ltr { animation: ltr o.5s linear both; } .rtl { animation: rtl o.5s linear both; } .utd { animation: utd o.5s linear both; } @keyframes ltr { 0% { transform: translateX(-100px); opacity: 0; } 100% { transform: translateX(0); opacity: 1; } } @keyframes rtl { 0% { transform: translateX(100px); opacity: 0; } 100% { transform: translateX(0); opacity: 1; } } @keyframes utd { 0% { transform: translateY(-100px); opacity: 0; } 100% { transform: translateY(0); opacity: 1; } }
taylorkimjw1
2023-12-03T13:10:05.723Z
댓글 1
좋아요 1
조회수 381
미해결
반응형 웹사이트 포트폴리오(App Official Landing Website)
각 섹션별 모두 완성하였습니다. Section Display의 각 섹션을 하나씩 풀어서 볼 때는 문제가 없습니다. 하지만 모두 주석 처리하여 볼 때 문제가 있습니다. .faq 섹션의 accordian이 작동하지 않습니다. 위 각 항목 눌러지지 않아요. .guide 섹션에서 close modal이 작동하지 않습니다. 위 X버튼이 작동하지를 않아요.
taylorkimjw1
2023-12-03T07:51:48.499Z
댓글 3
좋아요 1
조회수 435
미해결
실전! 웹사이트제작! Step by Step! (대방산업_InteractiveWeb)
강사님, 안녕하세요. 슬라이드 안 find out more 버튼 스크롤 애니메이션이, 가운데 정렬로 올라가는게 아니라, 오른쪽으로 치우쳐있다 가운데로 올라갑니다. css에선 left:50%; 되어 있던데 왜 그럴까요?? (올려놓으신 수업 파일도 똑같은 현상입니다.)
HTML/CSS jquery 인터랙티브-웹 클론코딩 반응형-웹
Heajin Sohn
2023-11-14T05:08:15.757Z
댓글 1
좋아요 0
조회수 408
미해결
UIUX 디자이너 취업을 위한 웹 포트폴리오 제작 : 퍼스널 브랜딩 전략
안녕하세요, 맨 첫 강의인 <header영역 레이아웃> 수업을 듣고 있는데, 강의 내용과 똑같이 진행하였으나 Css가 적용되지 않아 질문 드립니다. Google에 검색을 통해 쿠키 삭제, link대신 @import 사용 등을 실행했으나 결과는 똑같았고, F12 눌러 개발자용 모드로 확인 해보았는데 css가 작동되지 않는다는 알림만 뜰 뿐 해결책을 찾지는 못했습니다. 이러한 경우에 어떻게 해결할 수 있을까요? 미리 답변 감사드립니다.
HTML/CSS 포트폴리오 반응형-웹 gsap scrolltrigger
심현정
2023-11-06T11:31:40.974Z
댓글 1
좋아요 0
조회수 322
해결됨
반응형 웹사이트 포트폴리오(App Official Landing Website)
pc버전에서 브라우저 화면을 줄일 때 저렇게 화면이 깨지는데 실제 다른 웹 사이트 처럼 화면을 줄여도 안 깨질려면 max-width 768 버전 말고 max-width 1200도 같이 만들어줘야 하나요?
길 산
2023-10-26T11:02:53.211Z
댓글 2
좋아요 1
조회수 674
해결됨
반응형 웹사이트 포트폴리오(Architecture Agency)
개발자도구에서 모바일 버전으로 볼때 계속 인터넷 연결없음으로 나옵니다 ㅠㅠ 그리고 폴더에 있는 index파일을 누르면 사진과 같이 기본 셋팅만 나오는데 왜 그런지 알 수 있을까요?
오잉
2023-10-25T02:04:47.317Z
댓글 6
좋아요 2
조회수 542
미해결
UIUX 디자이너 취업을 위한 웹 포트폴리오 제작 : 퍼스널 브랜딩 전략
이번에 업데이트 해주신 gsap 수업자료에 json 파일은 vscode를 사용해야지만 확인이 가능한건가요? 이전 영상과는 수업자료가 조금 다른거같아 질문드립니다.
HTML/CSS 포트폴리오 반응형-웹 gsap scrolltrigger
아장
2023-10-25T00:43:53.674Z
댓글 3
좋아요 0
조회수 330
미해결
입문자를 위한 반응형 웹 기초 강의
안녕하세요 강사님, <div id='parents'> <div id='child'></div> </div> 여기서 이 밑 두 코드의 차이점을 알 수 있을까요? <style> #parents { width: 50%; } #child { max-width: 100%; } </style> <style> #parents { width: 50%; } #child { width: 100%; } </style>
rlawlsgus125
2023-10-22T15:41:53.047Z
댓글 1
좋아요 0
조회수 481
미해결
반응형 웹사이트 포트폴리오(App Official Landing Website)
블록요소기 때문에 슬라이드 밑줄에 위치되어야 하는걸로 아는데 왜 슬라이드와 겹쳐서 저렇게 페이지 맨 상단 왼쪽에 위치되는지 모르겠습니다.
김지안
2023-10-22T12:01:01.692Z
댓글 1
좋아요 1
조회수 363
미해결
실전! 웹사이트제작! Step by Step! ('크루알라모드'_반응형웹 제작)
안녕하세요. 위 화면처럼 contents부분의 들어간 video가 옆에 세로 스크롤이 생깁니다. 처음엔 가로, 세로 스크롤이 다 생겨서 다시했더니 이번엔 세로 스크롤이 생기네요. 강의를 더 가면 object-fit: cover;로 맞추던데.. 그렇게 해도 스크롤은 사라지지 않아요. 지금은 우선 여기까지 진도를 나갔지만.. 처음 진도를 나갈땐 visual title의 font-size: 70px;도 먹지않아 글씨가 작았는데.... 왜 그럴까요?
HTML/CSS jquery 인터랙티브-웹 반응형-웹
최은석
2023-10-20T02:06:52.977Z
댓글 1
좋아요 0
조회수 291
해결됨
UIUX 디자이너 취업을 위한 웹 포트폴리오 제작 : 퍼스널 브랜딩 전략
섹션 14 5차_업데이트(고정된 섹션에 하위 섹션 올라오는 인터렉티브) ScrollTrigger 실무활용_ScrollTrigger Script적용 영상 오류 확인 요청 드립니다. 4분 37초 정도 부터 30분 50초 정도 까지 블랙 화면(소리 X)으로 나옵니다. 확인 후 회신 부탁 드립니다.
HTML/CSS 포트폴리오 반응형-웹 gsap scrolltrigger
suda111
2023-10-19T02:23:54.847Z
댓글 3
좋아요 1
조회수 393
미해결
UIUX 디자이너 취업을 위한 웹 포트폴리오 제작 : 퍼스널 브랜딩 전략
Y축 섹션 고정스크롤애니메이션 강의에서 스크롤을 올리면 border-radius준 영역 밖으로 bg가 보이는데 어떻게 없애면 될까요??
HTML/CSS 포트폴리오 반응형-웹 gsap scrolltrigger
withme1004v
2023-10-17T07:10:16.441Z
댓글 1
좋아요 0
조회수 310
미해결
실전! 웹사이트제작! Step by Step! ('크루알라모드'_반응형웹 제작)
안녕하세요. 수업자료 다운시 내용이 없습니다. 압축폴더가 올바르지 않다며 풀리지도 않습니다. jaja29@naver.com 으로 보내주실 수 있을까요?
HTML/CSS jquery 인터랙티브-웹 반응형-웹
2023-10-16T10:58:15.291Z
댓글 2
좋아요 0
조회수 335
미해결
반응형 웹사이트 포트폴리오(Architecture Agency)
<!doctype html> <html lang="ko"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <link href='http://fonts.googleapis.com/css?family=Open+Sans:400,300,700' rel='stylesheet' type='text/css'> <title>DesignWorks Architecture Agency</title> <!-- Page Scroll Effects JS & CSS --> <script src="/js/jquery-2.1.4.js"></script> <script src="js/velocity/modernizr.js"></script> <script src="js/velocity/velocity.min.js"></script> <script src="js/velocity/velocity.ui.min.js"></script> <script src="js/velocity/main.js"></script> <link rel="stylesheet" href="/js/velocity/velocity.css"> <!-- Custom JS & CSS --> <script src="/custom.js"></script> <link rel="stylesheet" href="/style.css"> <link rel="stylesheet" href="/reponsive.css"> </head> <!-- hijacking: on/off - animation: none/scaleDown/rotate/gallery/catch/opacity/fixed/parallax --> <body data-hijacking="on" data-animation="rotate"> <div class="container"> <section class="cd-section visible" id="home"> <div> <div class="content"> <img src="/images/temp-section-01.jpg"> </div> </div> </section> <section class="cd-section" id="about"> <div> <div class="content"> <img src="/images/temp-section-02.jpg"> </div> </div> </section> <section class="cd-section" id="project"> <div> <div class="content"> <img src="/images/temp-section-03.jpg"> </div> </div> </section> <section class="cd-section" id="plan"> <div> <div class="content"> <img src="/images/temp-section-04.jpg"> </div> </div> </section> <section class="cd-section" id="awards"> <div> <div class="content"> <img src="/images/temp-section-05.jpg"> </div> </div> </section> <section class="cd-section" id="location"> <div> <div class="content"> <img src="/images/temp-section-06.jpg"> </div> </div> </section> <section class="cd-section" id="content"> <div> <div class="content"> <img src="/images/temp-section-07.jpg"> </div> </div> </section> <header> <div class="gnb-inner"> <div class="logo"> <a href="#none"><img src="/images/logo.png"></a> </div> <div class="gnb"> <div class="menu"> <a href="#home">Home</a> <a href="#about">About</a> <a href="#project">Project</a> <a href="#plan">Plan & History</a> <a href="#awards">Awards</a> <a href="#location">Location</a> <a href="#contact">Contact</a> </div> <div class="slogan">We design places, not projects.</div> </div> <div class="trigger"> <span></span> <span></span> <span></span> </div> </div> </header> </div> <nav> <ul class="cd-vertical-nav"> <li><a href="#0" class="cd-prev inactive">Next</a></li> <li><a href="#0" class="cd-next">Prev</a></li> </ul> </nav> </body> </html> @media (max-width: 768px) { /* Entire Layout */ .cd-section { height: auto; } .cd-section > div { height: auto; } .content { position: static; width: 100%; height: 100%; } /* Header */ .menu { display: block; } .slogan { display: none; } .gnb { background-color: #fff; position: fixed; top: 0; right: -270px; width: 250px; height: 100vh; box-shadow: -5px 0 10px #0000002a; transition: 0.3s; } .gnb.active { right: 0; } .menu { line-height: 40px; margin-top: 60px; } .menu a { display: block; text-align: right; padding-right: 20px; color: black; font-size: 20px; } /* Trigger */ .trigger { display: block; width: 24px; height: 14px; position: absolute; right: 20px; top: 20px; } .trigger span { position: absolute; height: 1px; width: 100%; background-color: black; transition: 0.3s; } .trigger span:nth-child(1) { top: 0; } .trigger span:nth-child(2) { top: 50%; width: 90%; } .trigger span:nth-child(3) { top: 100%; } .trigger.active span:nth-child(1) { top: 50%; transform: rotate(45deg); } .trigger.active span:nth-child(2) { top: 50%; width: 90%; opacity: 0; } .trigger.active span:nth-child(3) { top: 50%; transform: rotate(-45deg); } } $(function(){ /* Trigger */ $('.trigger').click(function(){ $(this).toggleClass('active') $('.gnb').toggleClass('active') }) $('section, .menu a').click(function(){ $('.gnb').removeClass('active') }) }) 모바일에서 트리거메뉴 클릭시 제이쿼리(아이콘X로 변경 슬라이더메뉴 나오기)가 적용되지 않는데 왜 이럴까요 ㅠ 클레스네임부분에서 틀린게 없습니다
오잉
2023-10-13T15:28:01.696Z
댓글 2
좋아요 3
조회수 473
미해결
반응형 웹사이트 포트폴리오(Architecture Agency)
모바일에서 트리거메뉴 클릭시 제이쿼리(아이콘X로 변경 슬라이더메뉴 나오기)가 적용되지 않는데 왜 이럴까요 ㅠ 클레스네임부분에서 틀린게 없습니다
오잉
2023-10-12T14:42:43.125Z
댓글 1
좋아요 1
조회수 218
미해결
플렉스(Flex) 반응형 웹사이트 포트폴리오(The World's Best Cities)
<div className="할아버지"> <div className="아버지"> <div className="본인"></div> </div> </div>; 분명 이 강의 어디에서 배웠는데 기억이 안나서 질문을 올립니다. classname="본인"이 아버지의 영역을 무시하고 할아버지의 영역을 기준으로 본인의 영역을 설정하는 방법이 있었는데요 기억이 안나네요 분명 아버지 class에 어떤 css 속성을 설정을 해주면 아버지의 영역을 무시할 수 있었던 것으로 기억을 하는데 도움 부탁드립니다!
콩팥팥죽
2023-10-12T02:34:55.455Z
댓글 2
좋아요 1
조회수 887
미해결
UIUX 디자이너 취업을 위한 웹 포트폴리오 제작 : 퍼스널 브랜딩 전략
강의듣고 자바스크립트로 코드 변경해보고싶은데... 질문글에 있는글을 보니 제이쿼리뿐아니라 제이쿼리를 사용한 플로그인을 사용한다고 되어있던데 제이쿼리를 사용한 플로그인을 사용하나요?... 제이쿼리를 사용한 플로그인은 따로 자바스크립트로 교체가 안되는건가요?
HTML/CSS 포트폴리오 반응형-웹 gsap scrolltrigger
베스트
2023-10-11T02:58:57.581Z
댓글 1
좋아요 0
조회수 290
미해결
UIUX 디자이너 취업을 위한 웹 포트폴리오 제작 : 퍼스널 브랜딩 전략
이 코드를 처음 보는데 이게 왜 여기에 넣어지는지 모르겠어요. content: attr(data-char); *혹시 이 선생님 수업 영상 중에 기초가 될 수 있는 강의가 있을까요. 처음 보는 코드가 많이 보여서 공부를 해보고 싶습니다.
HTML/CSS 포트폴리오 반응형-웹 gsap scrolltrigger
민혜
2023-10-10T11:37:03.007Z
댓글 1
좋아요 0
조회수 362
미해결
반응형 웹사이트 포트폴리오(Architecture Agency)
custom.js에서 $(function(){ $('.trigger').click(function(){ $(this).toggeClass('active') $('.gnb').toggeClass('active') }) $('section, .menu a').click(function(){ $('.gnb').removeClass('active')}) $('.menu a').click(function(e) { e.preventDefault(); $.scrollTo(0, 900); }); }) 제이쿼리스크롤을 index.html에 링크 건 후에 custom.js의 click 부분들에 줄이 그어졌습니다."선언이 여기에 사용되지 않음으로 표시되었습니다" 라고 뜨는데 어떻게 해결해야 할까요?
김지홍
2023-10-09T10:45:34.933Z
댓글 1
좋아요 1
조회수 289
미해결
반응형 웹사이트 포트폴리오(Architecture Agency)
자동으로 위로 줄이 올라가는데 어떻게 해결해야 하나요?..
김지홍
2023-10-08T11:11:39.483Z
댓글 1
좋아요 1
조회수 246
