본문 바로가기

[IT/Programming]/HTML related

Implementing multicursor like sublime text Ctrl+D in HTML javascript textarea # Implementing multicursor like sublime text Ctrl+D in HTML javascript textarea 작성중인 글... 구현하기 쉽진 않은거 같네;;;;; 뭐 급한건 아니니 천천히 시도해 봐야지. 그런데 javascript 에서 multi selection 을 지원해 주긴 하나? 안해주면 짜기 엄청 복잡해질것도 같은데 ㅠㅜ; ## PH 2023-06-27 : First posting. ## TOC ## textarea with id="myTextarea" textarea 에서는 span tag 가 안먹혀서 이걸로는 구현 못할것도 같은데... ## div with contenteditable and id="myDiv" div with contenteditable 에.. 더보기
Javascript (자바스크립트): async 와 await # Javascript (자바스크립트): async 와 await 우선 단어 뜻부터. asynchronous: 동시에 일어나지 않는, 비동시적인, 비동기의. await: 기다리고 있다. 보통 javascript code 는 동시 다발적으로 (synchronous 하게) 실행되는데, 즉 코드가 적힌 순서대로 처리하는게 아니라 HTTP 요청을 보냈다가 숫자들 계산했다가 HTTP 답변이 왔으면 계산하다가 멈추고 HTTP 답변받은걸 처리했다가 문자열 띄우기도 했다가 alert 보냈다가 하는 식으로 말이다. 그렇기에 순서적으로 실행되어야 제대로 동작하는 코드가 있으면, 즉 HTTP 요청 ($.ajax, fetch 등) 후 데이터를 받아서 그 받은 데이터 가지고 화면에 표시해야 하는 작업이 있으면 그냥 javasc.. 더보기
Neighbors points plot plan (svg) # Neighbors points plot plan (svg) 이웃들의 점수들을 similarity weight 줘서 그려주는 법 svg 로 공부하는 중. ## PH 2023-09-09: First posting. ## RRA www.w3schools.com :: SVG Tutorial Google docu - spreadsheet :: Recos and Statistics ## TOC ## Plot Example 각종 numbers 출처: . 100/23=4.347826087 4.347826087*3=13.04347826 4.347826087*21=91.30434783 0 1 2 3 4 5 6 7 8 9 10 52.38 ```[.linenums.lang-html] 0 1 2 3 4 5 6 7 8 9 1.. 더보기
Rotating circles using CSS # Rotating circles using CSS 로딩 오래걸릴때 로딩중 알려주는 rotating circles 구현해 봅시다. ## PH 2023-09-10 : First posting. ## TOC ## Rotating circles ```[.linenums.lang-html] ```/ ## RRA codepen.io :: Rotate Circle using CSS 더보기
AWS server|서버 에서 GitHub 가 너무 느려질때 해결 방법. # AWS server|서버 에서 GitHub 가 너무 느려질때 해결 방법. How to solve the extremely slow response of GitHub in AWS server EC2 instances. (Use google translate to read the way to solve the problem.) 아무리 찾아봐도 해결책을 못찾겠었는데 , AWS 에서 outbound 설정을 좀 바꿔봤더니 해결되어서 해결법을 공유함. ## PH 2023-09-21 : First posting. ## TOC ## Outbound 보안상 AWS Network & Security :: Security Groups outbound TCP port 를 1024 - 65535 까지만 열어놨었었는데, 이게.. 더보기
HTML docuK format ver. 2.3 (2023-10-25) HTML docuK format ver. 2.3 (2023-09-24) 개인적으로 만들고 있는 LaTeX 비슷한 형태의 HTML document format + JavaScript. 이름은 그냥 docuK로 'document designed by kipid'란 뜻. This is an HTML document format named docuK which is rendered by JavaScript, jQuery, MathJax, and google code prettifier. Specific features are changable mode/font, resizable font-size/line-height, table of contents, auto numbering of sections/figur.. 더보기
트위터 트윗 퍼오기 (Embedding Twitter Tweet) # 트위터 트윗 퍼오기 (Embedding Twitter Tweet) 트위터 글 (twitter tweet) 을 퍼오는 (embed) 하는 방법이다. 뭐 방법은 간단한데, javascript 가 먹히는 사이트에서만 쓸 수 있을듯. 트위터 웹페이지에 가면 "답글, 리트윗, 관심글 담기" (Reply, Retweeted, Favorite) 옆에 더 보기 (More) 가 있고 이것을 클릭하면 "트윗 담아가기" (Embed tweet) 가 보인다. 그러면 아래와 같은 javascript link 가 들어간 html code 를 준다. 이걸 원하는 곳에 붙여넣으면 "답글, 리트윗, 관심글"도 작동하는 트윗이 퍼가진다. 각종 옵션들도 설정할수 있는듯하니 reference 가서 더 공부해 보시길. ## TOC ## .. 더보기
인터넷, Web, HTML, 블로그에서 수식 사용하기 (Equation or math in HTML, blog) 인터넷, Web, HTML, 블로그에서 수식 사용하기 (Equation or math in HTML, blog) 블로그에 물리/수학 관련 이야기를 쓰면서 수식 쓸 일이 많았는데, 해결 방법을 찾았다. 아래아한글 (hwp), MS-word도 수식입력기를 지원하지만, 복사와 편집이 쉬운 plain text 형태의 LaTeX 수식이 갑인듯 하다. 입력 방법에는 대략 아래와 같은 방법들이 있다. 각자 편할데로 골라잡자. 윈도우에서는 (Windows 7부터인가?) 손글씨로 입력한 수식도 인식하고 디지털화 해주는 수식입력기 (Math Panel Input) 도 기본 프로그램으로 제공한다. 이런 프로그램은 대체 어떻게 짠건지... 후덜덜;; Tablet PC가 대중화되면서 많은 사람들이 이용하기 시작할듯? 손으로 쓸.. 더보기