일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
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 |
- 개발자
- xcode
- javascript
- css3
- keyframes
- jQuery
- MAC
- SWIFT
- image
- effect
- 애니메이션
- iOS 개발자
- php
- react
- 백엔드
- html5
- iPhone
- 프론트엔드
- ipad
- 비전공 개발자
- CSS
- button
- 자바스크립트
- IOS
- HTML
- front-end
- 풀스택
- hover
- Animation
- 비전공자
- Today
- Total
목록javascript (248)
비전공자 개발일기
Open Color Picker const imgInput = document.querySelector('#img-select') const imgPreview = document.querySelector('.preview') if(!window.EyeDropper){ alert("Your browser does not support this feature") } const eyeDropper = new EyeDropper() const pickerBtn = document.querySelector('.open-picker') const result = document.querySelector('.res') imgInput.addEventListener('change', function() { const..
Sign Up Sign Up Sign In Forgot your password? Sign In Sign In Sign Up :root { /* COLORS */ --white: #e9e9e9; --gray: #333; --blue: #0367a6; --lightblue: #008997; /* RADII */ --button-radius: 0.7rem; /* SIZES */ --max-width: 758px; --max-height: 420px; font-size: 16px; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", san..
Content Container Cillum laborum reprehenderit dolor tempor ullamco veniam in veniam mollit ex minim id anim dolore cillum. Slide 1 Slide 2 Slide 3 Slide 1 Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute..
Key Mapping E Crash R Ride F Floor tom G Mid tom H High tom V B Kick J Snare I Hi-Hat Open K Hi-Hat Closed JavaScript Drum Kit J B V H G F E R I K @import url(https://fonts.googleapis.com/css?family=Handlee|Pacifico); html, body { padding: 0; margin: 0; background-color: #fff; } .main-wrapper { margin: 30px auto 0; width: 1080px; text-align: center; } .main-title { font-family: 'Pacifico', cursi..
html { background: #09131d; text-align: center; font-size: 10px; } body { margin: 0; font-size: 2rem; display: flex; flex: 1; min-height: 100vh; align-items: center; } .clock { width: 30rem; height: 30rem; border: 7px solid #09131d; box-shadow: -4px -4px 10px rgba(67, 67, 67, 0.5), inset 4px 4px 10px rgba(0, 0, 0, 0.5), inset -4px -4px 10px rgba(67, 67, 67, 0.5), 4px 4px 10px rgba(0, 0, 0, 0.3);..
JavaScript Snake Game Score: You lose! Play html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5, h6,p,blockquote,pre,a,abbr,acronym, address,big,cite,code,del,dfn,em, img,ins,kbd,q,s,samp,small,strike, strong,sub,sup,tt,var,b,u,i,center, dl,dt,dd,ol,ul,li,fieldset,form, label,legend,table,caption,tbody,tfoot, thead,tr,th,td,article,aside,canvas,details,embed, figure,figcaption,footer,header,h..
Copy in Clipboard with JavaScript Write something and copy it into your clipboard by clicking in the button below. Copy in clipboardCopied /* Just to play with animations */ .copiedtext { position: absolute; left: 0; top: 0; right: 0; text-align: center; opacity: 0; transform: translateY(-1em); color: #000; transition: all .500s; } .copied .copiedtext { opacity: 1; transform: translateY(-2em); }..
Mario Matching Game Reset Game * { margin: 0; padding: 0; box-sizing: border-box; } body { display: flex; justify-content: center; align-items: center; flex-direction: column; min-height: 100vh; } h2 { margin-bottom: 30px; font-size: 2.5em; } .box { position: relative; width: 600px; height: 200px; border-bottom: 2px solid #555; display: flex; justify-content: center; align-items: center; flex-di..