본문 바로가기

😁 프로젝트(들)

🔥 온라인 불멍 사이트를 만들어보자
😁 프로젝트(들) 2022. 3. 2. 🔥 온라인 불멍 사이트를 만들어보자 🔥완성 사이트: https://eggjini.github.io/boolmung/ 🎨깃허브 주소: https://github.com/Eggjini/boolmung 🎟️ 개요 (라 쓰고 잡담이라 읽는다) 불멍은 워낙에 많이 유명한지라 잘 알고 있을 것 같다. 그래도 간단하게 설명하자면 불 지펴놓고 멍때리는거다 불 지피는것도 그렇고 (귀찮음...) 코로나 때문에 집에 콕! 틀어박혀 있으니 온라인으로 사이트를 만드는 것도 나쁘지 않은 것 같다. 😗 구상이란 걸 하고 시작하자 이때까진 아무 생각 없이 만들었지만, 적어도 구상이라는 것은 해 보려고 한다. 재능기부: 내 손 사용 프로그램: 윈도우 기본 그림판 이렇게! 그림판으로도 그림을 그릴 수 있다(?) 는 것을 보여드렸습니다. 🧑‍💻 기본 틀 잡기 일단 구상한 ..
[🎨썸네일 메이커] 다음, 구글 검색 등록하기
😁 프로젝트(들) 2022. 2. 26. [🎨썸네일 메이커] 다음, 구글 검색 등록하기 이 제목과 부제목이 기대를 하길래 검색 등록을 해 주겠습니다. 🔥 다음 검색등록 일단 다음부터 등록을 해 줄께요. 사실상 다음 검색등록이 가장 쉽답니다. https://register.search.daum.net/index.daum Daum - 검색등록 Daum 검색등록 사이트 검색을 무료로 등록할 수 있는 서비스입니다. 언제든 정보보완 수정이 가능하며, 등록 후에는 Daum 검색결과에 노출되어 수많은 네티즌들이 방문하게 됩니다. 신규등록하기 register.search.daum.net 여기에 등록할 사이트를 넣어 주고, 확인을 누른 다음에 이렇게 약관에 동의를 하면 됩니다. 이렇게 설명하고 다 적어 준 다음에 신청자 정보도 입력을 해 주고 확인 버튼만 누르면 등록이 완료됩니다! 너무 간단해, 만족해 🔥..
[🎨 썸네일 메이커] 업데이트 - 그라데이션 배경
😁 프로젝트(들) 2022. 2. 26. [🎨 썸네일 메이커] 업데이트 - 그라데이션 배경 썸네일 메이커 사이트를 배포하고 나서, 생각보다 많은 관심을 주셨습니다! 그래서 제가 나름 생각해 두었던 그라데이션을 배경으로 설정하는 기능을 넣어 보려 합니다 그라데이션 기다려라! 🙀 Div 클릭할때 이벤트 제가 이렇게 각각 g1~g11 의 div를 만들어 놓고, changeG(gi) 형태로 function을 실행시키게 해 두었습니다. 이건 지난 업데이트때도 적용이 되었었던 내용이예요. 이게 chagneG 함수 내부의 모습이고요 (좀 비효율적인 코드....😂) HTML 삽입 미리보기할 수 없는 소스 각각 변수 값마다 그라데이션을 다르게 설정하는 코드입니다. 이제 이 그라데이션 값들을 다 바꿔 줘야 해요. 이 Div들에 적용한 그라데이션 효과대로 배경에 적용해 줄 겁니다! 👉 CSS 그라데이션 쉽게 적용..
[⏰미닛 타이머] HTML, CSS로 간단한 파이 타이머 만들기
😁 프로젝트(들) 2022. 2. 25. [⏰미닛 타이머] HTML, CSS로 간단한 파이 타이머 만들기 CodeSandbox를 이용하여 제작했습니다. Codesandbox 이용법은 👉온라인 IDE 코드샌드박스를 참고하세요 타이머 링크: https://eggjini.github.io/minute-timer/ Minute Timer 시작 초기화 eggjini.github.io 우선, 이런 타이머를 HTML과 CSS로 만들어 보도록 합시다! 이 타이머는 제가 직접 HTML과 CSS, 자바스크립트를 이용해서 제작한 사이트예요. 무엇보다 디자인에 신경을 좀 썼습니다. (예쁘면 장땡이지 뭐...) 📌 돌아가는 타이머 구현 저 빙글~빙글 돌아가면서 남은 시간을 직관적으로 나타내 주는 타이머를 만들어 봅시다. 이런 파이타이머를 구현하기 위해서 방법과 소스코드들을 찾아다녔지만 딱히 마음에 들지 않아서 몇 가지만 참고하여 ..
[🎨썸네일 메이커] 모바일 미지원 안내
😁 프로젝트(들) 2022. 2. 25. [🎨썸네일 메이커] 모바일 미지원 안내 🔔 안내 🔔 썸네일 메이커를 모바일에서 접속하면 이렇게 다~ 잘려서 보입니다. 물론 반응형 웹 디자인을 하면 되지만, 지금은 어떻게 할 수 없는 관계로 "모바일 접속 지원을 종료합니다" 혹시나 반응형으로 디자인하게 된다면 모바일도 접속이 가능하도록 업데이트를 할 예정입니다. 🔥 자바스크립트 모바일 접속 불가를 알려주는 알림창을 띄우고, 그 알림창의 확인을 누르면 이 포스팅으로 연결되도록 코드를 만들었습니다. HTML 삽입 미리보기할 수 없는 소스 파이어폭스에서 User Agent 를 변경하고 접속해 보니 이렇게 알림창이 뜹니다. Android, IOS는 물론 다른 모바일 환경에서 접속해도 이 알림창이 뜨게 됩니다. 멘트만 좀 바꿔서 사이트에 적용했습니다. 참고로 소스코드는 전체 공개됩니다. (깃허브에 있..

티스토리툴바