목록분류 전체보기 (189)
진스
1. window.scrollTo 메서드 문법 window.scrollTo()에는 두가지 사용법이 있다. 참고) MDN - Window.scrollTo() Window.scrollTo() - Web APIs | MDN Window.scrollTo() scrolls to a particular set of coordinates in the document. developer.mozilla.org 1) window.scrollTo의 문법 중 첫번째는 다음과 같다. window.scrollTo(xpos, ypos) 2) 두번째는 다음과 같다. window.scrollTo({top:0, left:0, behavior:'auto'}); 더 자세한 내용은 다음 w3 문서 링크에서 확인할 수 있다. CSSOM Vie..

번외? let scrollTop = window.scrollY||document.documentElement.scrollTop ; ie는 window.scrollY없으므로 document.documentElement.scrollTop 로 쓸수있게 자바스크립트 현재의 스크롤바 위치 가져오는 방법 자바스크립트를 사용하여 현재의 스크롤바 위치값을 가져오는 방법입니다. webisfree.com 출처 [Vue.js/Nuxt.js] Element 높이 값 받아오기 노란색 동그라미 부분이 내용에 따라 높이가 변화한다그렇기 때문에 노란색 동그라미 부분이 변함에 따라 빨간 박스도 높이값이 변화알고 싶은 것:빨간색 상자 높이 값을 구한 다음, 파란 부분 velog.io 노란색 동그라미 부분이 내용에 따라 높이가 변화한다 ..
LoginForm.vue username password 로그인하기 {{ message }} 포커스로 이동하는 함수실행을 이유는 모르지만 created훅에 넣으면 에러가 발생 mounted 안에서는 제대로 작동됨을 확인했다.

ESLint: failed to load config "@vue/prettier"to extend from. 에러를 접함.. 이거저거해보다 .eslintrc.js 파일내에서 수정하니 동작하였다 수정전 extends: ["plugin:vue/essential", "eslint:recommended", "@vue/prettier"], 수정후 extends: [ "eslint:recommended", "plugin:vue/recommended"], prettier 적용 안될 경우 VSCode > Preference (cmd+,) 들어가서 'Default Formatter'를 검색 아래 설정이 null로 되어있을 텐데, 이를 'enbenp.prettier-vscode'로 고쳐준다. VSCode Prettier ..
탭을 스와이프해서 넘기는 것을 구현하고자 한다. vuetify 라이브러리를 사용 할수도 있지만 세부 커스터 마이징이 어려워서 라이브러리를 쓰진 않았다. 방법1. HTML - 이벤트 캐치할 div - 탭의 개수만큼 Transition 생성 - 선택된 탭만 보이도록 하위 div에서 v-if 조건으로 설정한다. JS /* TAB 관련 Method */ switchtab (n) { if (this.activetab > n) { this.transition = 'slide-prev' } else if (this.activetab < n) { this.transition = 'slide-next' } }, start (e) { this.settouchpos(e, 'start') }, move (e) { this.s..
mousemove // js new Vue({ el : '#canvas', data : { x : 0, y : 0 }, method : { eventXY : function(event) { this.x = event.offsetX; this.y = event.offsetY; } } }) // html {{x}}, {{y}} keyup // keyup의 경우 keyupEvent 실행 // keyup중 enter키일 경우 keyupEvent 실행 // keyup중 alt+enter키일 경우 keyupEvent 실행
도로명+건물명,도로명,지번,건물명 data() { return { address: '', }; }, computed: { isAddressValided() { return this.address != ''; }, }, methods: { chageAddress(e) { this.address = e.target.value; }, },
css-compact https://marketplace.visualstudio.com/items?itemName=jsonchou.css-compact css-compact - Visual Studio Marketplace Extension for Visual Studio Code - let's go back to original way to write our css marketplace.visualstudio.com 코드를 한 줄로 만드는 VScode의 확장 프로그램은 더 있지만, 주석을 삭제하지 않는 확장 프로그램은 이것밖에 찾지 못했다. 코드를 수정한 후에 단축키 shift+alt+f를 사용하면 코드가 한 줄로 돌아온다. scss-compact https://marketplace.visualstud..