팝업창 영역을 제외하고 선택 시 팝업창이 닫히는 코드입니다. 팝업입니다 팝업입니다.팝업입니다 팝업입니다. 팝업입니다 팝업입니다.팝업입니다 팝업입니다 .팝업입니다 팝업입니다.팝업입니다 팝업입니다.팝업입 니다 팝업입니다.팝업입니다 팝업입니다. .popup { width: 200px; height: 200px; position: absolute; left: 50%; top:50%; transform: translate(-50%, -50%); border: 1px solid green; border-radius: 8px; text-align: center; z-index: 99; background: #fff; } .blackBg{ position: fixed; left: 0; top: 0; width: 100..
let priceNum = $("input[name=nftPrice]").val(); let pattern = /^(\d{1,12})([.]\d{0,10}?)?$/; if ( !pattern.test(priceNum) && priceNum != ''){ if( priceNum.indexOf('.') > 0 ) { if( priceNum.toString().split(".")[0].length > 12 && priceNum.toString().split(".")[1].length > 10 ) { $('#integralError').removeClass('hide'); $('#integralError').text('소수점 위로 최대 12자리까지 입력 가능합니다.'); $('#demicalError').rem..
[javaScript] - setTimeOut() : 전역 setTimeout() 메서드는 만료된 후 함수나 지정한 코드 조각을 실행하는 타이머를 설정합니다. setTimeout(function() { console.log('Hello World!'); //타이머가 만료된 뒤 실행할 function입니다. }, 500); [조건] 1. 클릭 후 배경색이 변경됩니다. 2. 배경색이 변경 되며, 텍스트가 변경됩니다. Copy .copyTooltip { width: 100px; background:#222; border-radius: 16px; padding:16px 0; box-sizing: border-box; box-shadow: 0px 4px 12px 0px #0000001A; position: rel..
[요구사항] 1. 배너에 마우스를 올리면 배경이 생깁니다. 2. 배너 클릭 시 하얀색 하트가 빨간색 하트로 변경됩니다. 3. 배너 클릭 시 배너 color가 변경됩니다. [이슈사항] *제이쿼리를 최소한으로 이용하고 css로 처리하는 방법입니다. 1. 광고배너와 배경 배너를 같은 위치로 마크업을 해줍니다. 2. 배경 배너를 position: absolute; 처리하여 광고배너와 위치를 맞춰줍니다. 3. 제이쿼리로 광고 배너 클릭 시 addClass : geryBanner 해 줄 예정입니다. - geryBanner라는 클래스가 생겼을 시 변하는 color들을 css로 처리 해 줍니다. .newsLike.greyBanner { border: 1px solid #e1e4e6; } .likeBannerWrap.g..
[조건] 1. 버튼 클릭 시 url 이 복사됩니다. 2. 버튼 클릭하는동안 버튼의 배경색에 opacity가 들어가야합니다. 3. 복사와 함께 복사되었습니다. 라는 토스트 팝업이 잠시 나왔다가 사라집니다. [html] 1. 링크복사 버튼은 css로 모양을 만들어줄 예정입니다. 2. 토스트 팝업은 잠시 숨겨둘 예정입니다. 링크복사 링크가 복사되었습니다. [css] 1. 버튼에 :active를 활용하여 클릭하는 동안 배경색에 opacity를 적용합니다. * : active :: 마우스를 사용하는 경우, "활성"이란 보통 마우스 버튼을 누르는 순간부터 떼는 시점까지를 의미합니다. [참고] https://developer.mozilla.org/ko/docs/Web/CSS/:active :active - CSS: ..

[이슈사항] - 소개하고 싶은 글이 2줄이하일 때는 더보기 버튼이 보이지 않아야합니다. - 2줄이상일 때는 더보기 버튼이 보여야하며, 더보기버튼 옆 화살표가 아래로 내려가 있는 모양이어야합니다. - 더보기 버튼이 펼쳐져있을 때는 화살표가 위로 올라가는 모양이어야합니다. [2줄 이하 일 때 더보기 버튼이 사라지게 하기] 1. 전체를 감싸는 div(infoIntroWrap)의 height를 80px로 설정해줍니다. 2. 소개하는 글의 div ( infoIntro)의 height가 80px보다 작으면 더보기버튼(btnMore)을 지워줍니다. [2줄 이상일 때 더보기 버튼이 보이게 하기] -더보기 버튼 클릭 시 - 1. infoIntroWrap의 height가 80px이 넘어가면 보이지 않게 overflow:h..
- Total
- Today
- Yesterday
- 퍼블리셔
- slick-slide
- frontend
- 퍼블리싱
- 리액트 포탈
- 제이쿼리
- react portal
- CSS
- react
- HTML
- React.js
- 로그인폼
- excel custom
- file-saver
- jQuery
- Portal
- 슬릭 슬라이드
- 프론트엔드개발
- node.js
- excel down
- paging-custom
- 탭메뉴
- 디자인시스템만들기
- npm
- 페이징 커스텀
- react excel 다운
- css3
- javascript
- 개발
- 프론트엔드
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | ||||
4 | 5 | 6 | 7 | 8 | 9 | 10 |
11 | 12 | 13 | 14 | 15 | 16 | 17 |
18 | 19 | 20 | 21 | 22 | 23 | 24 |
25 | 26 | 27 | 28 | 29 | 30 | 31 |