0517 금 uiux 32일차

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 부분. 이게 최종임 아마도)