전체 글 (98) 썸네일형 리스트형 제이쿼리 플러그인 활용 목차 1. 스와이퍼 2. 게시물 슬라이더 3. GSAP 4. 천천히 나타나는 상품리스트 1. 스와이퍼 스와이퍼 사용법 공식 사이트 : https://swiperjs.com/ 라이브러리 : https://swiperjs.com/get-started 데모 : https://swiperjs.com/demos - 해당 코드들 복붙하면 기초적인 사용법 터득이 가능(라이브러리 코드) 이미지 슬라이더 만들기 실습 나중에 포스팅 2. 게시물 슬라이더 실습 나중에 포스팅 3. GSAP GSAP 기초 애니메이션 라이브러리 jQuery & GSAP 라이브러리 가져오는 링크 : https://cdnjs.com/ 예시 var tl = gsap.timeline({ repeat:-1, repeatDelay:1 }); tl.from.. [AlexNet] ImageNet Classification with Deep Convolutional Neural Networks Abstract AlexNet : ImageNet Classification with Deep Convolutional Neural Networks 5개의 Conv층과 3개의 FC로 구성(6천만개의 파라미터, 65만개의 뉴런) 최종 층은 1000-way softmax 학습을 더 빨리 하기 위해 non-saturating 뉴런과 효율적인 GPU 구현을 사용했다. 과적합을 줄이기 위해 정규화 기법인 dropout을 사용했도, 매우 효과적이였다. contest top-1 top-5 *ImageNet LSVRC-2010 37.5% 17.0% ImageNet LSVRC-2012 26.2% 15.3% *1000개의 클래스로 분류된 120만개 고해상도 이미지 Index 1. Intoduction 2. The Data.. 프로그래밍 입문자를 위한 CSS 기초 목차 1. CSS 시작하기 – CSS 기분 문법 및 작성 방법 2. 텍스트와 박스 모델 – 텍스트, 여백 그리고 배경까지 3. 위치 정하기 – float과 position 4. flexbox – flex 속성 활용하기 5. 한 걸음 더 나아가기 – 상호작용, 세부위치 등 세세한 부분까지 생각하기 1. CSS 시작하기 – CSS 기분 문법 및 작성 방법 [CSS란? CSS의 역할 알아보기] Cascading Style Sheets 웹 문서의 콘텐츠에 스타일을 추가하는 언어 [CSS 기본 문법 및 사용 방법] 기본 문법 /* 선택자{ 속성명 : 속성값; }*/ p{color: red;} 선택자 : 어떤 요소에 스타일을 적용할지에 대한 정보 {중괄호} : 선택한 요소에 적용할 스타일을 정의하는 영역 속성명 :.. 프로그래밍 입문자를 위한 HTML 기초 목차 1. HTML이란? 2. HTML 시작하기 - HTML 기본 문법 및 작성 방법 3. 콘텐츠 표시하기 - 텍스트, 이미지, 링크 그리고 목록 4. 입력요소 - 사용자 입력을 받는 다양한 방법 5. 한걸음 더 나아가기 - 웹 사이트의 사용성을 향상시키는 방법 1. HTML이란? HTML, HyperText Markup Language HyperText : 하이퍼링크를 통해 어떤 문서에서 다른 문서로 접근할 수 있는 텍스트 Markup : (콘텐츠를) 표시하다(HTML의 문법적 특성) Language : 언어 하이퍼 텍스트와 콘텐츠를 표시해주는 언어이다. 쉽게 말해, HTML은 웹브라우저를 통해 표시되는 웹페이지인 콘텐츠를 정의하기 위해 사용하는 언어이다. HTML 문서 만들기 파일을 수정하고 싶다면,.. #. jQuery 기초와 활용 목차 1. 제이쿼리 기초 2. 제이쿼리 이벤트 3. 이미지 갤러리 사이트, 사이드 바 - 제이쿼리 적용 4. 회색 사이트, 메뉴바 구현, 드롭다운 - 제이쿼리 적용 1. 제이쿼리 기초 팝업창 만들기 JS console.clear(); for ( let no = 1; no 실습. 팝업창 만들기 & 제이쿼리 적용 목차 팝업창 만들기 이미지 갤러리 사이트, 사이드 바 - 제이쿼리 적용 회색 사이트, 메뉴바 구현, 드롭다운 - 제이쿼리 적용 팝업창 만들기 HTML 버튼 1 버튼 2 버튼 3 닫기 내용 1 닫기 내용 2 닫기 내용 3 CSS .popup { position:fixed; top:0; left:0; width:100%; height:100%; background-color:rgba(0,0,0,.3); display:none; align-items:center; justify-content:center; } .popup.active { display:flex; } .popup > section { width:100%; max-width:800px; border:10px solid black; padding:.. #. JavaScript 기초와 활용 목차 1. 변수, 출력, 조건문 2. 함수, 매개변수, 리턴 3. 객체 1. 출력, 변수, 조건문 출력하기 console.clear(); console.log(); 텍스트와 숫자 더하기 console.clear(); console.log(10 + 10); // 20 console.log("점수 : " + "10"); // "점수 : 10" console.log("점수 : " + 10); // "점수 : 10" console.log("점수 : " + 10 + 20); "점수 : 1020" console.log("점수 : " + 10 * 20); "점수 : 200" console.log("점수 : " + (10 + 20)); "점수 : 30" 변수 console.clear(); let x; // 변수 x 생.. #. POSITION 속성(2) 목차 4. fixed와 before/after 그리고 트랜지션 심화 5. 이미지 갤러리 사이트, 사이드바 만들기 4. fixed와 before/after 그리고 트랜지션 심화 fixed postion : absolute와 동일하나, 스크롤바를 따라다닌다. div { position:fixed; top:0; left:0; width:300px; height:100%; background-color:red; } before/after 기본적으로 inline-block이다. /* ::after => 새로운 막내자식을 추가한다. */ ul > li::after { content:"님"; } /* ::after => 새로운 막내자식을 추가한다. */ ul > li::before { content:"위대하신 "; .. 이전 1 2 3 4 ··· 13 다음