묻고 답해요
161만명의 커뮤니티!! 함께 토론해봐요.
인프런 TOP Writers
-
미해결비전공자를 위한 진짜 입문 올인원 개발 부트캠프
id 태그 질문입니다.
안녕하세요 그랩님. 강좌 잘 듣고 있습니다. 제가 id값을 동일하게 지정해도 한 id값만 적용된다고 배웠는데, 실제로 해 보니 동일한 id값을 갖는 모든 텍스트가 색이 변했습니다. 이렇게 된다면 id와 class에 차이가 없는 것 아닌가요?? --------코드---------- <html> <head> <style type="text/css"> p { color: orange; } #id-test { color: skyblue; } .love { color: #BA68C8; font-size: 100; font-weight: 900; } .love2 { color: #00AAFF; font-size: 100; font-weight: 900; } </style> </head> <body> <p>Hello</p> <p>Hello!</p> <div id="id-test">id</div> <div id="id-test">id</div> <div class="love">class</div> <div class="love2">class</div> </body> </html>
-
해결됨[하루 10분|Web Project] HTML/JS/CSS로 나만의 심리테스트 사이트 만들기
결과 값이 계속 1번만 출력이 됩니다. 수정해도 오류만 뜨네요
사용자 응답 사진으로 구현하기를 만들고 있는데 2번째 질문에서 이미지를 누르면 이런 에러가 뜹니다. function ImageFadeOut(qIdx, idx) { var left = document.querySelector('.leftImage'); var right = document.querySelector('.rightImage'); left.disabled = true; left.classList.remove("fadeIn"); left.classList.add("fadeOut"); right.disabled = true; right.classList.remove("fadeIn"); right.classList.add("fadeOut"); setTimeout(() =>{ if(qIdx+1 === endPoint) { goResult(); return; } else { setTimeout(() => { var target = qnaList[qIdx].a[idx].type; for(let i = 0; i < target.length; i++){ select[target[i]] += 1; } goNext(++qIdx); },300); } },300) } setTimeout 안에 있는 var target = qnaList[qIdx].a[idx].type에서 type을 빼면 결과 값이 출력이 되지만 첫번째 결과값만 출력이 되고 배열도 [0,0,0,0,0,0]으로 출력이 됩니다. data.js는 아무 이상이 없어 보이는데 뭐가 문제일까요
-
미해결애플 웹사이트 인터랙션 클론!
main-add.js 코드 오류 있습니다. 이거 보고 수정하세요
main-add.js 내용 적용했는데 section-2 부분의 messageC부분이 section3까지 넘어가서 뭔가 이상하다고 생각했습니다. 실제로, 강의 영상에 나온 것이랑 값이 차이나서 수정한 부분 올립니다. sceneInfo의 section2부분의 value만 변경해주시면 됩니다. values: { messageA_translateY_in: [20, 0, { start: 0.15, end: 0.2 }], messageB_translateY_in: [30, 0, { start: 0.5, end: 0.55 }], messageC_translateY_in: [30, 0, { start: 0.72, end: 0.77 }], messageA_opacity_in: [0, 1, { start: 0.15, end: 0.2 }], messageB_opacity_in: [0, 1, { start: 0.5, end: 0.55 }], messageC_opacity_in: [0, 1, { start: 0.72, end: 0.77 }], messageA_translateY_out: [0, -20, { start: 0.3, end: 0.35 }], messageB_translateY_out: [0, -20, { start: 0.58, end: 0.63 }], messageC_translateY_out: [0, -20, { start: 0.85, end: 0.9 }], messageA_opacity_out: [1, 0, { start: 0.3, end: 0.35 }], messageB_opacity_out: [1, 0, { start: 0.58, end: 0.63 }], messageC_opacity_out: [1, 0, { start: 0.85, end: 0.9 }], pinB_scaleY: [0.5, 1, { start: 0.5, end: 0.55 }], pinC_scaleY: [0.5, 1, { start: 0.72, end: 0.77 }], pinB_opacity_in: [0, 1, { start: 0.5, end: 0.55 }], pinC_opacity_in: [0, 1, { start: 0.72, end: 0.77 }], pinB_opacity_out: [1, 0, { start: 0.58, end: 0.63 }], pinC_opacity_out: [1, 0, { start: 0.85, end: 0.9 }], },
-
해결됨반응형 웹사이트 포트폴리오(Architecture Agency)
전체 레이아웃 와이어프레임 퍼블리싱(PC) - 전체레이아웃, 헤더영역
19분40초 overflow: hidden; 을 적용 하였으나, 여전히 이미지가 맞춰지지 않습니다. ㅠㅠ 그래서 .content > img { position: absolute; width: 100%; top: 50%; left: 50%; transform: translate(-50%, -50%); } 을 적용 시켜서 이미지를 맞췄습니다. 하지만 다음 강의 모바일편에서 @media 를 적용시키니 이미지가 나오지가 않습니다.
-
해결됨만들면서 배우는 HTML/CSS
html, body{...}와 배경에서의 오류
다음 사진과 같이 html, body 뒤에 무언인가를 작성하면 배경이 사라지게 됩니다. 어떤 오류인지 여쭤봐도 되겠습니까? 좋은 수업 감사합니다 선생님.
-
미해결자바스크립트 제대로 배워볼래?
script 부분의 주석이 자꾸 //로 처리되지 않고 <!-- -->로 처리됩니다
수업과는 조금 관계없는 질문인데 한번에 여러줄 주석처리할 때마다 너무 불편해서요 ㅠㅠ script 태그 내인데도 ctrl + / 누르면 자꾸 <!-- --> 이렇게 주석처리가 됩니다 심지어 그러고도 빨간줄이 떠요 (...) 강사님께서 하시는 것처럼 //로 주석처리되게 하는 방법이 있을까요?
-
미해결초보자도 만들 수 있는 스크롤 인터렉션. 1편 자바스크립트
5-3-2 계산식 질문 드립니다.
안녕하세요? 강사님 해당 강의 중 챕터 수식에 해당하는 부분이 이해가 가지 않아 질문드립니다. parallaxMoveDistance = Math.max(parallaxStartValue - parallaxStartValue, Math.min(parallaxStartValue, parallaxStartValue - (parallaxStartValue * (parallaxPercent/100)))); => parallaxStartValue - (parallaxStartValue * (parallaxPercent/100)) 위의 계산식 중에 min 계산부분이 이해가 가지 않습니다. 왜 저런 계산식이 나왔는지 의문이여서 질문드려요 ㅜㅜㅜ
-
미해결반응형 웹사이트 포트폴리오(Architecture Agency)
화면을 부드럽게 이동하는 scrollTo 제이쿼리에 대해서
코딩웍스 선생님 강의에서, 특정 버튼 클릭시 지정된 섹션으로 화면을 부드럽게 이동시켜주는 제이쿼리 플러그인으로 jquery.scrollTo.min.js라는 js 파일을 올려주시고 연결(<script src...>)시키는법을 알려주셨는데요. 그 후 적용해보는 강의 파트에서, 선택자에 명령어를 입력할때, $('선택자').click(function (e) { $.scrollTo(this.hash || 0, 900) }) 이렇게 써주시면서 , "이건 플러그인 제작자가 정한 공식이니 따라치면 된다." 라고만 설명하고 넘어가셨습니다. 여기서 $.scrollTo(this.hash || 0, 900)이 공식을 어디서 찾아낸 것인지 알고 싶은데 어떻게 찾아야 할까요? 욕심으로는 이것저것 다 물어보고싶긴 합니다만... - $뒤에 선택자가 없는 이유 - hash 는 무엇인지 - || 0, 900 는 무엇인지 ... 뿐만 아니라 다른 제이쿼리 플러그인들도 각각의 공식이 있을 것 같은데, 그걸 어떻게 찾아서 써야 하는 것일지 모르겠습니다!
-
해결됨비전공자를 위한 진짜 입문 올인원 개발 부트캠프
application 에러가 발생하는 이유가 뭘까요...
heroku에 서버 배포한 후 링크에 접속하면 application error라는 화면과 함께 heroku logs --tail라는 명령어를 사용해 에러내역을 확인할 수 있다는 설명이 나오는데요 명령어를 치면 아래와 같은 에러 로그가 나옵니다.. at=error code=H10 desc="App crashed" method=GET path="/" 여기저기 찾아보면서 package.json scripts에 heroku-postbuild 추가하기 package.json engine에 node와 npm 버전을 입력하기 heroku 빌드팩 변경하기 heroku restart하기 procfile 생성하여 web:node index.js 입력하기 이외에도 여러 방법을 다 시도해봐도 해결이 안되네요...
-
해결됨비전공자를 위한 진짜 입문 올인원 개발 부트캠프
코드 오류
안녕하세요 선생님.. 밑에 사진을 보면 알 수 있겠지만 선생님이 이 전 강의에서 예시로 작성하신 코드에다가 <Script ~~ /> 이 태그를 복습 겸해서 다시 사용해볼려고 했는데 사진처럼 Script로 다른 Aleart("~");이 있는 JS파일을 불러와서 저장하고 브라우저에서 봤는데 아무것도 안뜨고 하얀 화면 밖에 없는데 코드에 무슨 오류가 있길래 실행이 안되는 거에요ㅜㅜ?
-
미해결[하루 10분|Web Project] HTML/JS/CSS로 나만의 심리테스트 사이트 만들기
프로그레스바 로직 질문있어요....
ㅠ.ㅠ 저만 이해못하는지 질문이없네요.. 엔드포인트로 나누어서 인덱스+1 곱하시는 로직이 어떤 원리인지 궁금함미다...
-
미해결비전공자를 위한 진짜 입문 올인원 개발 부트캠프
TEST 폴더는 뭐죠?
grab-market-web 폴더에서 TEST로 바뀌었는데 TEST폴더로 시작하나요? npm install 다시 해야 하나요?
-
미해결인터랙티브 웹 개발 제대로 시작하기
-2550px 0 에 대한 제가 이해한 내용 그림으로 공유할게요!
제가 처음에 이해못할 때는 "보는 시각이 바뀌는거 아닌가?" 라고 생각하면서 첫번째 그림처럼 접근했어요. 이해가 됐을 때는 두번째 그림처럼 그림이 움직인다고 접근해서 이해했습니다. 두번째 그림의 부가설명을 하자면 처음 그림 포지션은 0 0 입니다. 1step -150px 0 만큼 그림이 왼쪽으로 움직입니다. 2step -150px 0 만큼 그림이 또 움직입니다 (총 -300px 0) ~~~~ 17step -150px 0 만큼 그림이 움직인다. (총 -2550px 0) 틀릴 수도 있습니다. 근데 전 이렇게 접근해보려구요!
-
미해결웹퍼블리셔가 알려주는 실무 웹사이트 따라만들기 Season1
default.css 가 적용이 안되요 ㅜㅜ
안녕하세요~ 선생님 블로그에서 default.css를 다운받아 <link rel="stylesheet" href="C:\Users\ASUS\Desktop\homepage\default.css"> <link rel="stylesheet" href="C:\Users\ASUS\Desktop\homepage\index.css"> 이렇게 html에 붙여넣기 했는데요 파일명은 속성-보안-개체이름에서 확인했습니다. index.css는 적용이 되는데 어째서인지 default.css는 적용이 안되네요 ㅜㅜㅜㅜㅜ 왜그럴까요 좀 알려주세요 ㅜㅜ
-
미해결반응형 웹사이트 포트폴리오(Architecture Agency)
slick이 작동되지 않는 문제
안녕하세요, 슬릭 슬라이더가 작동되지않고 jQuery.Deferred exception: $(...).slick is not a function TypeError: $(...).slick is not a function 이런 메세지가 나오는데요... 첨부해주신 단계별 코드를 보면서 하나하나 다 비교도 해보고 slick js, css 파일도 옮겨서 덮어써보고, jquery도 최신으로 바꿔봐도 슬릭 슬라이더만 작동이 되지 않는데 왜 그런 걸까요? index.html <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>DesignWorks Architecture Agency</title> <script src="https://code.jquery.com/jquery-3.5.1.min.js"></script> <!-- Page Scroll Effects JS & CSS --> <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"> <!-- Smooth Scrolling --> <script src="js/jquery.scrollTo.min.js"></script> <!-- Slick.js --> <link rel="stylesheet" href="js/slick/slick.css"> <link rel="stylesheet" href="js/slick/slick-theme.css"> <script src="js/slick/slick.min.js"></script> <!-- Custom JS & CSS --> <script src="custom.js"></script> <link rel="stylesheet" href="style.css"> <link rel="stylesheet" href="responsive.css"> <script src="https://kit.fontawesome.com/62a31d096f.js" crossorigin="anonymous"></script> </head> custom.js $(function(){ // Trigger $('.trigger').click(function(){ $(this).toggleClass('active') $('.gnb').toggleClass('active') }) $('section, .menu a').click(function(){ $('.gnb').removeClass('active') $('.trigger').removeClass('active') }) /* Smooth Scrolling */ $('.menu a, .gototop').click(function(e){ $.scrollTo(this.hash || 0, 900) }) // Change CSS with Scroll $(window).scroll(function(){ if($(window).scrollTop() > 50) { $('header, .gototop').addClass('active') } else { $('header, .gototop').removeClass('active') } }) // slick.js : history $('.history-slider').slick({ dots: true, infinite: false, speed: 300, slidesToShow: 4, slidesToScroll: 2, }) // slick.js : project photo $('.project-photo').slick({ dots: true, infinite: true, speed: 500, fade: true, autoplay: true, autoplaySpeed: 2000, cssEase: 'linear' }) })
-
해결됨만들면서 배우는 HTML/CSS
hosting 시 안되는문제
안녕하세요. 강의 잘 보았습니다. 고맙습니다. bracket에서의 가상서버에서는 해당 기능들이 잘되는데 실제 서버에 올리니 안됩니다. 이소스를 firebase에 deploy 했는데 슬라이드는 되는데, contents 영역과 아이콘들이 나오지 않습니다. font awesome을 CDN으로 해도 안나옵니다. 온리 그림만 나와서 슬라이딩 하고 있습니다. 왜 그런지 모르겠습니다. ^^;; 그리고 일부모니터에서는 화면이 잘나오는데 다른 모니터에서는 화면이 흔들리는 현상이 나오는데 이부분도 왜그런지 모르겠습니다. 알수있을까요? 수고하세요.
-
미해결나만의 포트폴리오 블로그 만들기(feat. 티스토리 스킨)
티도리 버전 확인이 안됩니다.
티도리 설치되어 있는 디렉토리에 들어간다음 tidory --version을 쳤는데 오류메시지만 나옵니다. npm install은 잘 됬는데 왜 이런거죠?
-
미해결초보자를 위한 HTML 기초
dialog 미지원 브라우저를 위한 fallback 관련 질문입니다
만약, dialog를 사용할 경우, 미지원 브라우저를 위한 fallback을 사용하면 된다고 하셨는데, 혹시 코드로 예시를 알려주실 수 있나요?
-
미해결비전공자를 위한 진짜 입문 올인원 개발 부트캠프
자막...
질문은 아니고 이번 강의 안에 들어가는 자막에 유독 오타도 많고 크기가 커서 수정이 필요해보입니다.
-
해결됨애플 웹사이트 인터랙션 클론!
비디오에 맞춰 텍스트가 나타나는 타이밍 질문입니다
안녕하세요 선생님 강의 잘 듣고있습니다!! 다름이 아니라 스크롤 섹션 2의 경우에는 비디오 타이밍에 맞춰 텍스트가 나오는데 그 타이밍 설정은 직접 콘솔로 scrollRatio 값을 확인해가면서 정하면 되는걸까요??
