반응형 front-end4 html 포인터 변경, 커서 변경 마우스를 가져갔을때 스타일이 바뀌는 것 쯤이야 style 태그 혹은 css 에 쉽게 적용할 수 있습니다. 하지만, 매번 div 하나를 위해 css 클래스를 만들고 :hover 와 같이 작성을 하는 것은 참 귀찮습니다. 그래서 오늘은 div의 style=""태그 안에 사용할 수 있는 onmouseover 효과를 적겠습니다 커서를 적용을 할 때에는, 많은 방법이 있겠지만, 설명드리게 될 방식은 한 번(한 페이지)만 실행될 커서 변경에 대한 코드입니다 아래는 지정할 수 있는 커서들의 목록이에요! auto 사용자 에이전트가 현재 맥락에 맞춰 표시할 커서를 결정. 예를 들어 글씨 위에서는 text를 사용합니다. default 플랫폼에 따라 다른 기본 커서. 보통 화살표입니다. none 커서 없음. context-.. 2022. 10. 4. 달력 뷰 만들기, fullcalendar 사용하기, 일정 달력 만들기, 캘린더 만들기 The Most PopularJavaScript Calendar - FullCalendar 오늘은 우리가 자주 사용하는 달력 앱들을 웹에 만드는 작업을 해보려고 합니다. 이를 위해 우리는 fullcalendar 이라는 것을 사용할 것입니다. 가장 일반적인 프레임워크인 React, Vue, Angular 전용 방식이 따로 존재하며, 일반적인 HTML에서 곧장 사용할 수 있는 방법 또한 있으니, 천천히 따라해볼게요. 어떤 환경에서도 사용을 할 수 있도록 HTML 에서 태그를 이용하여 캘린더를 사용해 보겠습니다 우리가 만드려고 하는 결과물 이를 사용하는 데에는 다른 라이브러리 처럼 유료버전, 무료버전이 있습니다. 무료버전만 사용해도 캘린더 뷰를 전혀 무리없이 사용을 할 수 있으며, 사용 방법도 간단합니다. F.. 2022. 7. 24. 줄바꿈, 칸 크기 조절 가능한 입력창 만들기 문제 발생 일반적으로 이름, 번화번호, 이메일 정도나 적던 input 칸에는 그렇게 많은 공간이 필요하지 않죠. 그래서 우리는 그저 일반적인 태그를 쓰게 되었습니다. 하지만 주문시 요청사항 혹은 기타 메모 등과 같은 입력 공간에는 줄바꿈(enter)이나 크기 변경, 안의 내용에 따라 크기가 변하는 input이 필요하게 되었습니다. 오늘은 이 부분을 해보시죠 해결 방법 TypeScript // 여기는 input으로 memo를 넣는 부분에서 text 칸이 유동적으로 변화하게 만드는 부분 const tx = document.getElementsByTagName("textarea"); for (let i = 0; i < tx.length; i++) { tx[i].setAttribute("style", "heig.. 2021. 7. 7. <select> <option value =1> number (int), string 오류 해결 문제 발생 html 1학년 2학년 3학년 typescript selectGradeHandler(event: any) { this.grade = event.target.value; } 우리는 value = "1" 이라 하면 1이라는 string으로 저장이 될 터이니, value = 1 이라고 하거나 grade를 number나 int 와 같은 숫자의 형태로 선언을 했다면 하면 숫자로 저장이 될 것일고 믿었다. 그런데... 아니었다... 이렇게 한참을 개발하고 나중에 === (타입과 값을 동시에 비교하는 것) 로 비교를 했는데 숫자 타입이 아니라는 오류가 났다... 반년간 운영된 웹사이트에 이런 식으로 데이터가 쌓여오던 것이었다. 개패고싶다. 하지만 == 으로만 비교하면 되므로 일단 패스. 이 글을 읽게 되는.. 2021. 7. 6. 이전 1 다음 반응형
