amanda의 공간입니다

자바스크립트로 mouse over (mouse enter) 호버 이벤트 구현하기 const wrap = document.getElementById('js_menu_wrap'); const items = wrap.children; for(let i=0; i

카카오톡 공유하기 기능 사용 후기 이미지 아래 타이틀과 텍스트만 들어간 깔끔한 형식을 원했는데 타입을 피드(feed)로 선택한 뒤 커스터마이징 하면 된다 공유하는 메시지에서 이미지의 썸네일 교체와 타이틀 및 텍스트 변경은 javaScript에서 커스텀 카카오 썸네일 이미지 크기는 1200*630을 주로 사용하므로 동일한 사이즈로 했다 * 카카오 공유하기 기능 구현 시 유의점 1. 공유하기 기능 사용 전 kakao dev의 내 애플리케이션 플랫폼에 url을 꼭 등록해두어야 한다. 2. 이동하는 url은 내 플랫폼에 등록된 메인 url의 하위 페이지만 가능 3. PC와 모바일 파일을 따로 사용하는 경우 모바일 url도 따로 등록해야 한다 ! 개인 계정으로 테스트해보니 회사 홈페이지 url도 내 플랫폼으로 등..

자바스크립트 특정일 팝업 띄우기 이벤트 let startDate= new Date("2023/11/10 00:00:00"); let endDate= new Date("2023/11/20 23:59:00"); if(Date.now() >= startDate && Date.now()

유튜브 재생 버튼 jquery로 만들기 html css .vod_conbox{ overflow: hidden; position: relative; height: 0; width: 100%; /* padding-top: 30px; */ padding-bottom: 56.25%; } .vod_conbox iframe, .vod_conbox object, .vod_conbox embed{ position: absolute; top: 0; left: 0; width: 100%; height: 100%; } .vod_thumb{ position: absolute; top: 0; left: 0; z-index: 1; width: 100%; height: 100%; background: #000; //intro 이미..

모바일 시 사용자가 좌우 스크롤 하도록 유도하는 이미지 띄우는 이벤트 모바일에서 터치 또는 영역 스크롤 시 이미지 사라지는 이벤트 // scroll wrap .scroll_wrap{ overflow-x: auto; width: 100%; } // guide image .scroll_guide{ position: absolute; top: 50%; left: 50%; width: 140px; height: 140px; z-index: 10; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); } .scroll_guide img{ max-width: 100%; } // scroll contents .scroll_content..

*카카오톡 공유하기 Demo https://developers.kakao.com/tool/demo/message/kakaolink?default_template=feed Kakao Developers 카카오 API를 활용하여 다양한 어플리케이션을 개발해보세요. 카카오 로그인, 메시지 보내기, 친구 API, 인공지능 API 등을 제공합니다. developers.kakao.com https://developers.kakao.com/docs/latest/ko/message/js-link Kakao Developers 카카오 API를 활용하여 다양한 어플리케이션을 개발해보세요. 카카오 로그인, 메시지 보내기, 친구 API, 인공지능 API 등을 제공합니다. developers.kakao.com 1. 피드 형식으..

html 현재 링크 복사하는 버튼 만들기 *출처 https://seill.tistory.com/1037 [JavaScript] 자바스크립트로 URL, 주소 복사 하는 방법 !! [JavaScript] 자바스크립트로 URL, 주소 복사 하는 방법 !! 예제 코드보시고 알맞게 사용하시면 됩니다 :) 예제 코드 결과값 seill.tistory.com

countup.js 같은 숫자 카운트 효과 순수 제이쿼리로 구현하기 $('.num').each(function () { var $this = $(this) var regex = /[^0-9]/g; var result = $this.text().replace(regex, ""); $({ countNum: 0 }).animate({ countNum: result }, { duration: 2000, easing: 'linear', step: function () { $this.text(Math.floor(this.countNum).toString() .replace(/\B(?