본문 바로가기

반응형

전체 글

(441)
[12일차]20210330 경일홈페이지 취업자인터뷰 버튼만들기 / 조건문, 반복문, 함수 function기초 복습 오전 - 경일홈페이지 취업자인터뷰 버튼만들기 .................... 인자값 = 매개변수 도통 어렵다.. AA ===================구글에 올라온 버튼 누르기 소스 =============================== 집가서 해보기..... 취업자인터뷰 글자 내용 1 글자 내용 2 글자 내용 3 글자 내용 4 &lt &gt var index = 0; var beNum = 1; var rolling = null; function slider(type,currentIndex,newIndex){ flag = true; li = document.querySelectorAll('.interview_content > li'); intBtn = document.querySelectorAl..
[11일차 연습] 움직이는 이미지 overflow:hidden, Java script 취업자인터뷰 내용이다1 내용이다2 내용이다3 내용이다4 -> JS for구문 var a 변수를 만들지 않고 for(i=0; ili{ position:absolute; top:0; display:none; } .interview_content>li>img{ width:238px; height:158px; } .interview_content>li.in{ display:block; animation:slider1 1s; animation-fill-mode: forwards; } @keyframes slider1{ from{left:238px;}to{left:0;} } .interview_content>li.out{ display:block; animation:slider2 1s; animation-fill-..
[11일차]20210329 경일홈페이지 취업자인터뷰 이미지 왼쪽으로 움직이기 + 블록체인 특강 아침 : 과제 점검 + 경일홈페이지 취업자인터뷰 공부 오후 : 블록체인 특강 얘가 마진 0auto 줄수잇는 wrap 활용 /* CSS Style sheet */ *{margin:0;padding:0;} ul,li{list-style: none;} a{text-decoration: none;} img{display:block;line-height:0;} #wrap{ width:100% } #header_wrap{ width:100%; /*height:300px; 얘를 없애야 visual_wrap 이 absolute 이 작동*/ background:red; } #header{ width:1200px; margin:0 auto; height:100px; background: blue; } #snb_wrap{ ..
[10일차 연습] 경일게임아카데미 홈페이지 만들기 먼저 레이아웃 잡기 top, haeder 완성 근데 top쪽에 움직이는거는 td 를 썼던데 쓰는법 배우기 *** list가 쭉 올라오는건 어떻게 하즹 imgs 3초마다 변경, 버튼 onclick 설정 snb 완성하기 -> snb 안의 글자가 계쏙 slider 활성화 안되었을 때도 나와서 고생 -> overflow:hidden 하니깐 사라짐 snb> width:100%했는데 오른쪽으로 치우친 이유 ???? '게임 콘텐츠 제작'취업률 1위! 취업현황-[트리노드] 임*진 훈련생 합격을 축하합니다. 정규 개강일-4월4일 월요일 학교소개 교육과정 취업정보 커뮤니티 상담신청 인사말 연혁 교직원소개 시설소개 오시는길 과정안내 취업자인터뷰 취업현황 포트폴리오 공지사항 수강후기 KI이야기 KI기자단 교수칼럼 상담게시판 ..
[10일차]20210326 여태까지 배운거 적용해서 경일게임아카데미 홈페이지 만들기 아침 = 어제 움직이는 배너 복습 버튼1 버튼2 버튼3 버튼4 버튼5 JS EVENTS 1. onmouseover 마우스를 올렸을 때 2. onmouseout 해당 영역에서 커서가 빠져나가는 순간 발생 ->커서가 빠졌을 때 (입력할수있는 공간이 ㅇ빠졌을 떄 ) 3. onmousedown 해당 객체의 영역에서 마우스 버튼이 눌려지는 순 ! 간 ! 발생 4. onmouseup 해당 객체의 영역에서 마우스 버튼을 떼는 순간 발생 5. onmousemove 해당 객체의 영역에서 커서가 움직이는 순간 발생 마우스를 올렸다가 땠을 때? -> onmouseleave onmouseover 와 onmouseenter 의 차이 onmouseover-> 자식영역ㄲㅏ지 이벤트 적용 onmouseenter -> 해당 영역까지 ..
[9일차 연습]to do list, 움직이는 배너 imgs 1. to do list 복습 JS 부분만 안보고 치기 2번 했는데 2번 틀림 1) delBtn.setAttribute='class', 'delbtn'; (x) -> delBtn.setAttribut=('id','delbtn'); 2) appenChild -> appendChild 3) parentNode 4) delBtn.onclick=function(){ list.removeChild(this.parentNode);} to do list 2. 움직이는 배너 bannerimg.item(i). 을 까먹음 clearInterval(banner) X-> clearInterval(rolling); n=index; X -> index=n; (위치에 ㄸㅏ라서 해석이 달라짐 **) btn1 btn2 btn3 btn..
[9일차]20210325 움직이는 배너 함수 적용 function sum(a, b){ -> a, b -> parameter 매개변수 (함수안으로 매개해주는 변수) document.write(a+b+' '); } sum(2,5); -> 2,5 argument 인자 - 함수로 들어오는 입력값 (입력) 입력 - argument출력 - return 함수에 결과값에 색상 넣기 ===================== 20210325오전 수업 =================================== css3? css = Cascading style sheets 현재 개발 중인 CSS3의 경우 그림자 효과, 그라데이션, 변형 등 그래픽 편집 프로그램으로 제작한 이미지를 대체할 수 있는 기능이 추가되었다. 또한 다양한 애니메이션 기능이 추가되어 어도비 플래시를 ..
[8일차 연습] moving clock, return, document.getElementsByClassName, for, if, getElementsByClassName, Math.floor / Math.random 1. moving clock 만들어 보기 1 2 3 #banner>li 는 html 이 많~~이 복잡할 때 어떤 # or . 의 li 인지 확인해야하기 때문에 ! li=document.querySelecorAll('#banner>li') -> 각 li 를 배열 [0], [1],[2]로 만듬 (Element type 으로!) Hello There Howaya list.removeChild(li) list.appendChild(li) -> 사라진 li 가 다시 append 됨. ( 살짝 이해가 안감........????????) 새로운 li 가 append된게 아니라 제거된 li [0] 가 붙음. 2. 함수, Return return 이 없으면 출력 undefined return은 계산해놓고 나중에 필요할 ..
[8일차]20210324 object, 함수 method 직접 찾아 적용하기 오전 : 어제 moving clock 한거 연습 + 이론 수업 앞으로 공부할 때 함수 () 요 안에 어떤 데이터 타입이 나올지 겅부 할것. setInterval(banner,3000); //3초마다 바ㄴ꾼것~ setInterval([],[]); //괄호 안에 1,2,3개 등이 들어갈 때 있음. 안의 값이름 =인자값 // 요 인자값 안에 string, number(int), function 어떤게 들어갈지 ? 아직 잘 모름. typeof () 는 타입을 말해주는듯.. console.log(typeof(sum(1,2,3))); -> undefined 함수의 type은 없대 함수 사용시 보통 return 이라는 것과 배움. 아직 출력하는게 없어서 화면에는 안나옴. -> 3 나옴 핸드폰이라는 객체 안에 5가지 ..
[7일차 연습] to do list & moving clock to do list to do list moving clockd 방법 1 111 222 333 방법2 이렇게 간단하다니.....,.,,,.,.,. 나와 짝꿍은 한 30줄 쓰구도 실 패...
[7일차]20210323 to do list 삭제 아침 : 어제꺼 복습 + 새로운 거 todo list 삭제버튼 오후 : 복습 + 새로운거 settimeout interval googld 공유폴더에 쌤, 승원님꺼 답 참고 To do list reading books jogging being happy 오늘 아침 자 혼자 만들어본기 엔터치면 입력되게 햇당ㅇㅇ Array 배열 배열.................................[]를 씀 변수선언 너무 많이 해야할 때 -> 배열을 씀 변수를 한번에 묶어서 사용하고 싶을 때 ~ 배열안에서의 length 속성값 : 변수의 갯수를 셈 = 총 개수 변수 [0,1,2,3,4,5] 이렇게 첫째자리는 0~~ , 콤마로 구분함. a=['kim', 'park'] 변수 추가 방법은 a.push(' ') 변수 총 개..
6일차 공부한 내용 정리 및 복습 -JS 조건문, 반복문, 변수, boolean, 색변경 등등 onclick 은 js만 쓸 수 있는 속성 ================변수 ============variable============================= ================JS 사용하여 버튼 클릭 -> 색상 변경=================== 방법 1 . script에서 변수 설정 -> onclick에서도 연결됨 You will be happy! 방법 2. 변수 설정을 onclick에만 하고 script에 연결 안됨. Here! 방법 3. Onclick 에다가 Document.부터 style까지 쭉 지정. 왜 안되지 다시 ㄱㄱ!!! $$$$$$$$$$$$$$$$$$$$ERROR$$$$$$$$$$$$$$$$$$$$$$$$$$ There! =======================..
[7일차]20210322 JavaScript 기초 / 조건문/반복문/제어문/등등.. 앞으로 한달 Javascript 공부. 아침 : 숙제 검사 + JavaScript 기초 이론 + 어려운 이론.. 오후 : 배운거 계속 반복 연습 숙제: 안보고 맨 마지막 꺼 다 칠 수 있도록. script 보통 head에 많이 들어감. body 에서도 작동은 되기는 함. 하지만head쓰는걸 권장~ JS쓸 때, ele 변수 document.querySelector 그냥 외우래~ #root -> id 값 document.write랑 뭐가 다르냐. -> css 처럼 선택을 해서 그 안에 넣어라 가능. querySelector 요즘꺼 getElementById 예전에 많이 쓰던거 (여기선 # 안씀 그냥 'root') 객체 Object : () -> 함수 (method) = -> 속성 함수 예시 console.l..
부스트코스 자바스크립트 <Javascript제어문> 강의 메모 Boostcourse Javascript by생활코딩 13. 프로그램, 프로그래밍, 프로그래머 14. 조건문 예고 Toggle 에 대해.. 15. 비교연산자와 불리언 비교연산자 = comparison operator === 이항연산자 + 도 이항연산자 오른쪽과 왼쪽의 값을 이용 Bealean : Ture or False 우리가 배운 data type 1. number2. string3. boolena Comparision operator & boolean === 1===1 1===1 1&lt2 2&gt1 html에서는 꺽쇠기호가 태그 나타낼 때 쓰여서 사용 혼란 막기 위해 대신 =>로씀 16. 조건문 Conditional statements Program IF-true IF-true if문에 () 괄호 안에는 boolean data type이 옴..
부스트코스 자바스크립트 <웹과 Javascript> 강의 메모 Boostcourse Javascript 1. 수업 소개 HTML 정보를 표현하고 주고받을 수 있음 사용자와 상호작용하는 웹페이지를 만들기 위해 동적인 JavaScript 만들어짐 Html 을 이용해 웹페이지를 만들고 + 그 위에 JavaScript 를 사용자와 상호기능을 추가. Html의 정보 + JavaScript의 기능 을 갖추게됨. Html - 멈춰있는 이미지 JavaScript - 이미지를 움직이게 하는 마법 2. 수업 목적 JavaScript -> 사용자와 상호작용하는 언어 Web brower -> 는 한번 사용되면 본인을 바꾸지 않는다. CSS - 디자인에 최적화된 언어 -> JavaScript 가 Html을 제어하는 것 / 다이나믹하게 Web page에 부여하는 것 3. Html과 JS의 만남 : Script 태그 Html 정적 ..
20210320 Javascript 기초 예습 The * Operator JavaScript Comparision Operators == equal to === equal value and equal type != not equal != not equal value or not equal type > greater than = greater than or equal to greater than = greater than or equal to
[6일차]20210319 프로그래머스 웹사이트 레이아웃 아침 시간 -> 과제 점검, 레이아웃 짜는 예시 공부(도움이 많이 됨 -> 오늘 한거 실습 폴더에 있음 ) 오후 시간 -> 2명 팀별로 "프로그래머스"웹사이트 만들기 과제 : 주말동안 "프로그래머스" 웹사이트 만들기 ~ / 자바 script : 제어문 예습해오기 / 연산자 사칙연산 등등 공부해오기 / 변수의 타입까즤,,,,,,,,, 레이아웃 짤 때 tip -> 레이아웃의 전체 마진을 다 주기. 그리고 padding으로 줄이기 / 마진을 top 제외하고 양옆 아래를 주면 나중에 안좋음 . 가장 간단한 소스 를 잘 짜는게 중요한 거 같음. 공통 분모를 class 로 묶기 등등 오늘한거 잘 참고 ㄱ ㄱ ㄱ 학생 중 가장 잘한 분의 레이아웃 그림을 보고 썜이 만든 HTML & CSS position_conten..
[5일차]20210318 Position:absolute; Postition:relative; Position:fixed 오늘 수업 아침 : position 개념 이해 + 질문 + 자습 오후 : 레이아웃 개념 + 1:1개인 상담 + 자습 DOCTYPE html> Document *{ padding:0; margin:0; } #box1{ width:200px; height:200px; background:red; margin-left:50px; } #box2{ width:200px; height:200px; background:blue; } a a ->>>>>>>>>>>>>>>>>>>>>>>> DOCTYPE html> Document *{ padding:0; margin:0; } #box1{ width:200px; height:200px; background:red; position:absolute; } #box2{ widt..
[4일차] 20210317 웹사이트 화면만 html 로 60% 만들기 아침 -> 자습 & 팀 웹페이지 만들기 HTML: DOCTYPE html> Document 학교소개 교육과정 취업정보 커뮤니티 상담신청 Game Architecture 게임 기획 게임기획자를 위한 정석 Class 바로가기 Game Programming 게임 프로그래밍 게임프로그래밍을 위한 정석 Class 바로가기 Game Artworks 게임 원화 게임 원화를 위한 정석 Class 바로가기 Progamer Coaching 프로게이머 코칭 프로게이머 데뷔 Class 바로가기 AR/VR AR/VR 증강현실/가상현실 Class 바로가기 Block Chain 블록체인 블록체인 Class 바로가기 공지사항 - - 3월 블록체인반 모집 임박 03-03 -> dd 는 단일로 사용하면 x dd->ul,li 같은 것 d..
20210316 3일차 웹사이트 container/box/ul/li /class etc. 가운데 정렬 방법 margin: 0 auto; = margin 0 auto; 0 auto; a를 넣는다는건 링크를 걸겠다는 것 CSS 궁금한거 a 를 쓰면 -> a 전체 가리키ㅌ는거 #wrap -> id wrap의 경로 (id 찾아가는거) .wrap -> class wrap 의 경로 ul,li -> 모든 ul,li 선택자 ? DOCTYPE html> Document div{ background:red; -> body tap에 있는 모든 div 에다가 red를 넣겠다. } 경일아카데미1 경일아카데미2 #header 만 해보기 DOCTYPE html> Document #header{ background:red; } 경일아카데미1 경일아카데미2 ====================================..
20210316 2일차 html, css 홈페이지 기본 틀 만들기 html Hypertext Markup Language ? --------------------------------------------------------------------------------------------------------------------------------- html:5 를 쓰면 자동으로 DOCTYPE html> Document 이게 뜸 * ctrl + S -> 실행 인라인? style 이니까 br 로 끝내서 내린다. DOCTYPE html> Document 제목 제목 제목 제목 제목 제목 글자1 글자2 글자3 글자4 HyperText Markup Language  -----------------------------------------------------------..

반응형