목록javascript (248)

비전공자 개발일기

Analog Clock

12 3 6 9 : : @font-face { font-family: "Digital-7"; font-style: normal; font-weight: 400; src: local("Digital-7"), local("Digital-7-Regular"), url(https://allfont.net/cache/fonts/digital-7_b73ef91485431ac0271f24009e14ccee.woff) format("woff"), url(https://allfont.net/cache/fonts/digital-7_b73ef91485431ac0271f24009e14ccee.ttf) format("truetype"); } :root { --clock-size: 300px; } * { box-sizing: b..
Javascript 2022. 7. 3. 00:44
Automatic Image Slider

/* Main Rules */ :root{ --white-c: #fff; --black-c: #000; --body-background-c: #FD7AC0; --wrapper-background-c: #D4F1F4; --wrapper-shadow-c: rgba(0, 0, 0, 0.219); --buttons-background-c: rgba(255, 255, 255, 0.219); --buttons-active-background-c: rgba(135, 207, 235, 0.493); } *{ margin: 0; padding: 0; box-sizing: border-box; } body{ font-family: 'Baloo Chettan 2', cursive; background: radial-grad..
Javascript 2022. 6. 30. 00:41
Toast Notification

Show Notification @import url('https://fonts.googleapis.com/css2?family=Poppins:wght@200;400&display=swap'); * { box-sizing: border-box; } body { background-color: rebeccapurple; font-family: 'Poppins', sans-serif; display: flex; flex-direction: column; align-items: center; justify-content: center; height: 100vh; overflow: hidden; margin: 0; } .btn { background-color: #ffffff; color: rebeccapurp..
Javascript 2022. 6. 29. 22:25
Arrow Magic Menu Indicator

Home About us Our Services Portfolio Team Contact * { margin: 0; padding: 0; box-sizing: border-box; list-style: none; text-decoration: none; } body { display: flex; justify-content: center; align-items: center; min-height: 100vh; background-color: #333; } ul { position: relative; display: flex; flex-direction: column; justify-content: center; align-items: center; } ul li a { position: relative;..
HTML _CSS 2022. 6. 28. 00:59
Animated Magic Menu Indicator

Home Profile Message Help Settings * { margin: 0; padding: 0; box-sizing: border-box; } body { display: flex; justify-content: center; align-items: center; min-height: 100vh; background-color: #F53B57; transition: .5s; } .navigation { position: relative; width: 70px; height: 350px; background-color: #FFF; border-radius: 35px; box-shadow: 0 15px 25px rgba(0, 0, 0, .1); } .navigation ul { position..
HTML _CSS 2022. 6. 24. 00:58
Project Management Dashboard

Portfolio Aybüke C. Projects December, 12 45 In Progress 24 Upcoming 62 Total Projects December 10, 2020 Web Designing Prototyping Progress 60% 2 Days Left December 10, 2020 Testing Prototyping Progress 50% 2 Days Left December 10, 2020 Svg Animations Prototyping Progress 80% 2 Days Left December 10, 2020 UI Development Prototyping Progress 20% 2 Days Left December 10, 2020 Data Analysis Prototy..
HTML _CSS 2022. 6. 22. 00:36
Sticky Note

Title #1 Text Content #1 Title #2 Text Content #2 Title #3 Text Content #3 Title #4 Text Content #4 Title #5 Text Content #5 Title #6 Text Content #6 Title #7 Text Content #7 Title #8 Text Content #8 @import url('https://fonts.googleapis.com/css2?family=Reenie+Beanie&display=swap'); @import url('https://fonts.googleapis.com/css2?family=Lato:ital,wght@1,300&display=swap'); div { margin: 20px auto..
JQuery 2022. 6. 21. 00:24
Word Counter

Word Counter Characters: 0 Words: 0 Sentences: 0 Paragraphs: 0 Reading Time: 0 Show readability score. Top keywords: /* border box */ html { box-sizing: border-box; -webkit-user-select: none; /* Chrome all / Safari all */ -moz-user-select: none; /* Firefox all */ -ms-user-select: none; /* IE 10+ */ user-select: none; /* Likely future */ } *, *:before, *:after { box-sizing: inherit; } b { font-we..
Javascript 2022. 6. 20. 00:31
이전 Prev 1 ··· 12 13 14 15 16 17 18 ··· 31 Next 다음