목록Javascript (176)

비전공자 개발일기

Drag & Drop File Upload

Upload your File : Drag & Drop or browse Supports: JPEG, JPG, PNG Download @import url('https://fonts.googleapis.com/css2?family=Poppins:wght@200;300;400;500&display=swap'); * { margin: 0; padding: 0; box-sizing: border-box; font-family: 'Poppins', sans-serif; } body { display: flex; align-items: center; justify-content: center; flex-direction: column; min-height: 100vh; background: #e0eafc; /* ..
Javascript 2022. 11. 8. 00:41
Image Editor

Easy Image Editor Filters Brightness Saturation Inversion Grayscale Brighteness 100% Rotate & Flip Reset Filters Choose Image Save Image /* Import Google font - Poppins */ @import url("https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600&display=swap"); * { margin: 0; padding: 0; box-sizing: border-box; font-family: "Poppins", sans-serif; } body { display: flex; padding: 10px; min-h..
Javascript 2022. 11. 3. 00:42
Captcha validation

Slider Captcha Please complete security verification! @import url('https://fonts.googleapis.com/css?family=Roboto:100,300,400,500,700,900&display=swap'); button:focus, input:focus{ outline: none; box-shadow: none; } a, a:hover{ text-decoration: none; } body{ font-family: 'Roboto', sans-serif; } /*----------------------*/ .block { position: absolute; left: 0; top: 0; } .slidercaptcha { margin: 0 ..
Javascript 2022. 10. 31. 00:06
Parallax Tilt Effect Cards

Parallax Tilt Effect Cards Hover over the cards. 01. Normal 02. Reverse 03. Normal *, *::after, *::before { margin: 0; padding: 0; box-sizing: border-box; } html { font-size: 62.5%; } body { --background-color: hsl(180, 20%, 90%); font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif; min-height: 100vh; padding: 2..
Javascript 2022. 10. 29. 00:11
TIP CAlculator

Tip Calculator How much was your bill? $ How was your service? -- Choose an option -- 30% - Outstanding 20% - Good 15% - Okay 10% - Bad 5% - Terrible How many people are sharing the bill? people Calculate! $0.00 each body { background: #333 url(https://photos-2.dropbox.com/t/2/AACXQ_67JHXFKvEaqJWfsntp3cdvZ5wouSYvGO6wvJXxrg/12/670825672/jpeg/32x32/1/_/1/2/cutlery.jpg/EMbmxb0FGB0gBygH/hFUR9L79V2OI..
Javascript 2022. 10. 23. 00:01
NASA APIs

NASA API Get Data body{ margin: 0; padding: 0; box-sizing: border-box; background-color: #eee; } #container{ /* height: 100vh; */ display: flex; align-items: center; justify-content: center; flex-direction: column; /* margin: 10px; */ padding: 5px; } #container{ text-align: center; } h1{ text-align: center; } .text{ text-align: center; } #container img{ margin-top: 2rem; height: 400px; width: 50..
Javascript 2022. 10. 19. 18:33
Netflix Landing Screen

Sign In See what's next Watch anywhere. Cancel Anytime Watch Free For 30 Days Cancel at any time Watch anywhere Pick your price If you decide Netflix isn't for you - no problem. No commitment. Cancel online anytime. Watch Free For 30 Days Watch TV shows and movies anytime, anywhere — personalized for you. Watch Free For 30 Days Watch on your TV Smart TVs, PlayStation, Xbox, Chromecast, Apple TV,..
Javascript 2022. 10. 17. 01:21
2048 GAME

2048 new game Paused reset continue end 2048 Score: pause Control left up down right You can also use Arrow keys! *{ margin:0; padding:0; box-sizing:border-box; } p{ border-radius:10px; padding:5px; border:2px solid white; background:lightgray; color:black; font-size:18px; text-align: center; } button{ font-family: 'Sniglet', cursive; } body { background: linear-gradient(45deg, rgba(189,245,152,..
Javascript 2022. 10. 11. 00:55
이전 Prev 1 ··· 3 4 5 6 7 8 9 ··· 22 Next 다음