0517 금 uiux 32일차
| 자바스크립트 수업페이지 ( https://codepen.io/hjyee/full/PogMVOP ) 강사님 수업페이지(html&css) ( https://codepen.io/hjyee/full/OJGrVYJ ) 기초 키보드 사용법 ( https://codepen.io/YoungHeom/pen/eYaOYEX ) 연산자 ( https://codepen.io/YoungHeom/pen/Rwmbxze ) 코드펜 사용법 ( https://codepen.io/YoungHeom/pen/gOJOWgE ) 무료 강의 ( https://programmers.co.kr/ ) |
.
웹페이지 만들기 구성 - 홈, 내부 3개. 총 페이지 4개
메인홈 ( https://codepen.io/YoungHeom/pen/NWVqPZO )
내부1 - 상품리스트 ( https://codepen.io/YoungHeom/pen/bGyddbm )
내부2 ( https://codepen.io/YoungHeom/pen/ZENbWXE )
내부3 - 로그인 페이지 ( https://codepen.io/YoungHeom/pen/LYopZPe )
세일러 만년필( https://en.sailor.co.jp/ ), 칼라버스 잉크( https://colorverseink.co.kr/ )
트위스비 ( https://www.twsbi.com/ ), 산리오 페이지 ( https://www.sanrio.co.jp/ )
페이지만들 때 참고할 사이트 - ( https://sailors.co.kr/ ), ( https://www.thehyundai.com/ )
※ () - 괄호 안에 쓴 건 안 들어가는 내용임
글씨체 후보
( https://fonts.google.com/specimen/Poetsen+One )
내부 1 페이지 상품 목록들에 넣을 것
( https://en.sailor.co.jp/category_product/fountain-pen/?taxonomy-detail=shikiori )
세일러 만요 잉크 ( https://en.sailor.co.jp/product/13-2009/ )
웹
제이쿼리로 팝업 만들기_ 내가 한거( https://codepen.io/YoungHeom/pen/eYapPvq )
제이쿼리로 〃_ 강사님 버전( https://codepen.io/hjyee/pen/jOobewX )
코드펜 안에서 cdnjs 제이쿼리 적용하는 방법
| $('.popup-box-1').click(function() { $('html').removeClass('popup-1-active'); }); $('.popup-box-1 > .popup').click(function(e) { // console.log(e); e.stopPropagation(); }); $('.btn-close').click(function() { $('html').removeClass('popup-1-active'); }); 이거랑 $('.popup-box-1').click(function() { $('html').removeClass('popup-1-active'); }); $('.btn-close').click(function() { $('html').removeClass('popup-1-active'); }); 이거의 차이 |
| $('.popup-box-1 > .popup').click(function(e) { // console.log(e); e.stopPropagation(); }); $('.btn-close').click(function() { $('html').removeClass('popup-1-active'); }); 이거랑 $('.btn-close').click(function() { $('html').removeClass('popup-1-active'); }); 이거의 차이 |
| $('.popup-box-1').click(function() { $('html').removeClass('popup-1-active'); }); $('.popup-box-1 > .popup').click(function(e) { // console.log(e); e.stopPropagation(); }); $('.btn-close').click(function() { $('html').removeClass('popup-1-active'); }); 이 세 가지 코드에 대한 설명(팝업 만들기 js 부분. 이게 최종임 아마도) |
'UIUX(03.28~10.02)' 카테고리의 다른 글
| 0521 화 uiux 34일차(깃허브) (0) | 2024.05.21 |
|---|---|
| 0520 월 uiux 33일차 (0) | 2024.05.20 |
| 0516 목 uiux 31일차 (0) | 2024.05.16 |
| 0514 화 uiux 30일차 (0) | 2024.05.14 |
| 0513 uiux 29일차 (0) | 2024.05.13 |
