반응형 Language/javascript4 자동 검색 및 pagination! input 태그를 사용하여 자동 검색을 만들어 보도록 하겠습니다. 우선 소스 코드입니다. javascript입니다. const userCardContainer = document.querySelector("[data-user-cards-container]");const userCardTemplate = document.querySelector("[data-user-template]");const headerSearchInput = document.getElementById("headerSearch");const portfolioSearchInput = document.getElementById("productSearch");let company = "A";let dataSet = "./informati.. 2024. 11. 11. html 요소 클릭시 문자열 복사하기 이번에는 특정 요소를 클릭 시에 crtl + C 복사하는 방법을 알아보도록 하겠습니다. 코드부터 살펴보도록 하겠습니다.html입니다. 02-4848-4848 javascript입니다. function copy(text){ window.getSelection().removeAllRanges(); try { navigator.clipboard.writeText(text); } catch {} window.getSelection().removeAllRanges();} onclick 속성은 클릭 시 실행되는 명령어입니다. title 속성은 마우스를 가져다 놓고 기다리다 보면 나오는 문자열입니다. window.getSelection().removeAllRan.. 2024. 11. 4. 모바일 전용 페이지 만들기 모바일 전용 페이지를 만들도록 하겠다. 현재의 Mozilla 버전(정보) + OS 정보 + 렌더링 엔진 정보 + 브라우저 이름을 기반으로 모바일 정보가 있는지 검사를 하는 것이다. var mobileKeyWords = new Array('iPhone','iPod','BlackBerry','Android','Windows CE','LG','MOT','SAMSUNG','SonyEricsson');for(var word in mobileKeyWords){ if(navigator.userAgent.match(mobileKeyWords[word]) != null) { location.href="모바일 전용 html 링크"; break; }} navigator.userAg.. 2024. 10. 28. 자연스로운 스크롤 이동 javascript와 html을 이용하여 진행을 하였습니다. 빠르게 코드 먼저 살펴보도록 하겠습니다. const animationMove = function(selector){ const targetEl = document.querySelector(selector); if (!targetEl) return; const browserScrollY = window.scrollY ? window.scrollY : window.pageYOffset; const targetScrollY = targetEl.getBoundingClientRect().top + browserScrollY; const rem = parseFloat(getComputedStyle(document.docume.. 2024. 10. 21. 이전 1 다음 반응형