내가 보려고 만든 블로그

항상 고정으로 정해두는게 아닌 동적으로 metatag를 넣구 싶을때?? 코드 $("meta[property='og\\:title']").attr('content', 'title'); $("meta[property='og\\:url']").attr('content', 'url'); $("meta[property='og\\:description']").attr('content', 'description'); $("meta[property='og\\:imageurl']").attr('content', 'imageUrl'); 얍 완성 끗 그럼 안뇽🙇🏻‍♀️

저번에 했던 카카오톡 링크 공유하기에 이어서 페이스북 링크 공유를 해보려구해요🤸🏻 카카오에 비해서 페이스북 도큐먼트가 별로 친절하지않았던 기억이 있어서 걱정을 많이했는데 생각보다 간단한거 같아서 놀랬어요 방법 1. window.open으로 공유하기 #코드 function shareFacebook(){ window.open('http://www.facebook.com/sharer.php?u=www.naver.com'); } 잉게 끝이라는거 🤭 솔직히 말이 안된다고 생각했느데 진짜 이게 끝이예요 #추가 저렇게만 넣으면 진짜 끝이긴한데 이쁘게 들어가지않아요 요로케 네이버처럼 이쁘게 넣구싶은데 현실은 이렇단 말이죠 네이버처럼 이뿌게 넣구싶을땐 저렇게 하면됩니다!! 메타태그에 추가해주기~.~ 페이스북 공식 페이지..

내가 지금 보고있는 게시글을 카카오링크로 공유하구 싶어서 만든 카카오링크 공유하기 1. 카카오 애플리케이션 만들기 (이미 있는 친구들은 넘기셔도 무관합니다) 그냥 간단하게 카카오 개발자홈페이지(https://developers.kakao.com/console/app) 들어가서 애플리케이션을 추가하면 완룡 2. 카카오 sdk 다운 및 추가하기 카카오 개발자 홈페이지에 있는 카카오 SDK 다운로드하기(https://developers.kakao.com/docs/latest/ko/sdk-download/js) 에서 원하는 SDK를 저장한뒤 넣어주자 3. 소스코드 4. 서버 콜백(추가) 카카오링크를 성공적으로 공유했는지 안했는지를 파악해야되는데 특별하게 success나 error 가 없었다 ㅠㅠㅠ 그래서 서버 ..

현재 URL을 라이브러리없이 클립보드로 복사하구싶을때?? function copyLink(){ let currentUrl = window.document.location.href; let t = document.createElement("textarea"); document.body.appendChild(t); t.value = currentUrl; t.select(); document.execCommand('copy'); document.body.removeChild(t); alart('복사가 완료되었습니다'); }

천천히 하면서 추가해야징(아마 여기없는 친구들은 검색하기 쉽거나 금방 찾을수있는 친구들일거야) 간단한건데 생각보다 오래걸렸다ㅠ 분명 시간지나면 까먹고 다시 검색하는데 시간 오래걸릴거같은 친구들... 항상 기억못하고 검색하는 친구들... 다중 클래스 체크된 갯수 구하기 $(".checkbox_class_name:checked").length 체크된 갯수만큼 출력!

내가 원하는 크기 만큼만 출력하고 그 이상 입력되어있을 경우 ...를 출력하고 싶을때 CSS로만 처리해버리기 * 여러줄일때 p{ text-overflow: ellipsis; -webkit-line-clamp: 1; //원하는 라인수 -webkit-box-orient: vertical; display: -webkit-box; white-space: normal; overflow: hidden; line-height: 20px; height: 20px; } #2020/07/31 오타 수정!

디자인도 이쁘고 편리!! https://github.com/fengyuanchen/datepicker#options fengyuanchen/datepicker ⚠️ [Deprecated] No longer maintained. A simple jQuery datepicker plugin. - fengyuanchen/datepicker github.com

그리드 레이아웃이란(Grid Layout)? 페이지를 여러 주요 영역으로 나누거나 크기 및 위치 문서 계층 구조의 관점에서 작성된 content 간 관계 정의하는데 아주 효율적인 레이아웃! 테이블처럼 세로 열과 가로 행을 기준으로 편하게 사용할 수 있다. 하지만 실질적으로 grid를 사용할 일이 없어서 잘 모르고 있다가 여러개의 일렬로 출력되는 데이터들을 2줄씩 출력하고 싶었다. 하지만 테이블을 이용하거나 flex를 이용하는 것보다 grid를 이용해서 하는 것이 더 효율적이라는 것을 발견! 만약 이러한 코드가 있다고 가정을 하자 .content_wrap{ width: 200px; height: fit-content; } .content_wrap .content{ height: 20px; backgroun..

자바스크립트에서 세션이 아닌 쿠키를 사용하고자 한다! 쿠키란? 쿠키는 클라이언트(브라우저) 로컬에 저장되는 키와 값이 들어있는 작은 데이터 파일입니다. 사용자 인증이 유효한 시간을 명시할 수 있으며, 유효 시간이 정해지면 브라우저가 종료되어도 인증이 유지된다는 특징이 있습니다. 쿠키는 클라이언트의 상태 정보를 로컬에 저장했다가 참조합니다. 클라이언트에 300개까지 쿠키저장 가능, 하나의 도메인당 20개의 값만 가질 수 있음, 하나의 쿠키값은 4KB까지 저장합니다. Response Header에 Set-Cookie 속성을 사용하면 클라이언트에 쿠키를 만들 수 있습니다. 쿠키는 사용자가 따로 요청하지 않아도 브라우저가 Request시에 Request Header를 넣어서 자동으로 서버에 전송합니다 출처: h..

content: ''; position: absolute; top: 50%; left: 50%; margin-top: -0.2rem; display: block; width: 0.35rem; height: 0.7rem; border-style: solid; border-color: var( --theme-color ); border-width: 0 0.2rem 0.2rem 0; -webkit-transform: translateX(-50%) translateY(-50%) rotate(45deg); transform: translateX(-50%) translateY(-50%) rotate(45deg);