분류 전체보기
[UXUI 웹디자인] 2달차 과제_33 / 팝업창 구현
https://ninefloor.github.io/web-practice/work/33/ $(document).ready(function(){ $(".layerPopup").click(function(){ $(".layer").show(); }) $(".close").click(function(){ $(this).parent().hide(); }) })
[UXUI 웹디자인] 2달차 과제_32 / 탭 메뉴 만들기
https://ninefloor.github.io/web-practice/work/32/ $(document).ready(function(){ $(".tab_cont2").hide(); $(".tab-btn>ul>li").eq(0).click(function(){ $(this).css({"text-decoration": "underline"}); $(".tab-btn>ul>li").eq(1).css({"text-decoration": "none"}); $(".tab_cont1").show(); $(".tab_cont2").hide(); }) $(".tab-btn>ul>li").eq(1).click(function(){ $(this).css({"text-decoration": "underline"}); $..
[UXUI 웹디자인] 2달차 과제_29~31 / 슬라이더 만들기
과제 29_상하 슬라이드 https://ninefloor.github.io/web-practice/work/29 $(document).ready(function(){ setInterval(slide,3000); }) let slide_num=1; function slide(){ $(".slideList").animate({top:slide_num*-360}); if(slide_num==2){ slide_num=0; } else{ slide_num+=1; } } 과제 30_좌우 슬라이드 https://ninefloor.github.io/web-practice/work/30/ $(document).ready(function(){ setInterval(slide,3000); }) let slide_num=1;..
[UXUI 웹디자인] 2달차 과제_24~28 / 드랍다운 메뉴 만들기
과제 24_전체메뉴 드랍다운 https://ninefloor.github.io/web-practice/work/24/ 과제 25_개별메뉴 드랍다운 https://ninefloor.github.io/web-practice/work/25/ 과제 26_전체메뉴 드랍다운+날개 https://ninefloor.github.io/web-practice/work/26/ .nav에 position: relative를 주고 하위에 div.nav_back 을 생성 .submenu와 거의 동일한 속성을 주되 width값과 position: absolute;를 이용해 위치를 조정하여 배경으로 깔릴 수 있게 잡아줌. 동작은 $(".submenu, .nav_back").slideToggle(500); 을 줘서 동시에 움직일 수 ..
7주차_예제 코드 모음
210215 See the Pen 210215_1 by seung-gu shin (@nine_floor) on CodePen. jquery의 기본과 .css 메소드 See the Pen 210215_2 by seung-gu shin (@nine_floor) on CodePen. jquery를 활용한 css 메소드 적용 예제 See the Pen 210215_3 by seung-gu shin (@nine_floor) on CodePen. parents 메소드와 하위 선택자 사용 See the Pen 210215_4 by seung-gu shin (@nine_floor) on CodePen. .css 메소드와 변수 선언 활용 See the Pen 210215_5 by seung-gu shin (@nine_f..