개발자의 끄적끄적

[javascript/jquery] jquery 최하단으로 스크롤 이동 시키는 방법 jquery 로 특정 데이터를 로드한 시점이라 특정 상황에 따라 스크롤을 맨 아래로 이동시켜야 하는 경우가 있습니다. 그럴때는 아래와 같이 scrollTop 를 이용해서 scrollHeight 값으로 이동시키면 됩니다. $('#test').scrollTop($('#test')[0].scrollHeight); 위 내용 보시면 아시겠지만, 스크롤이 되는 영역인 test 라는 아이디를 가지는 영역의 스크롤을 높이값을 입력하여 이동시키는 내용입니다. 참고들 하세요!

[javascript/jquery] javascript filereader get filename example / 자바스크립트 filereader 안에서 파일명 가져오는 방법 javascript 에서 filereader 로 파일을 읽으려고 하다보면 정상적으로 파일을 읽어서 로드된 뒤에 해당 파일명을 확인해야 하는 경우가 있습니다. 그럴때는 아래와 같이 reader.fileName 라는 객체에 읽어들인 file 이라는 객체안에 있는 name 라는 값을 세팅하고 reader.onload 를 실행하고 그 안에서 이벤트를 받아 target.fileName 를 출력해보면 로드되기전 세팅한 파일명 출력이 가능합니다! var reader = new FileReader(); reader.fileName = file...

[javascript/jquery] jquery rolling example / jquery 롤링 샘플 사이트 [링크] javascript 나 jquery 로 인터렉션을 구현하다 보면 특정 영역의 텍스트가 위로 혹은 아래로 롤링되도록 설정해야 하는 경우가 있습니다! 깔끔하게 구현되어있는 롤링 사이트가 있어서 공유하려고 합니다. 아래 사이트 들어가서 보시고 소스 확인해서 적용하시면 될듯 합니다! 참고들 하세요! https://codepen.io/hajaran/pen/BmbJLz Rolling text ... codepen.io

[javascript/jquery] jquery object to html example jquery 나 javascript 로 특정 엘리먼트를 가져오면 object 형태로 가져오게 됩니다. 그걸 다시 html 형태로 특정영역에 append 와 같이 밀어넣고 싶을때는 outerHTML 을 이용하시면 됩니다. 예를들어 아래와 같이 aaa 라는 아이디를 가지는 div 태그가 있다고 가정하고, test 위 엘리먼트를 아래와 같이 ele 라는 변수에 담고 var ele = $('#aaa'); 이것을 다시 html 형태로 값을 확인하고 싶으면 아래와 같이 outerHTML의 값을 출력하시면 됩니다. console.log(ele.get(0).outerHTML); 참고들 하세요!

[javascript/jquery] 자바스크립트 textarea 마우스 클릭위치 특정문구 추가하는 방법 javascript 에서 input 이나 textarea 와 같은 입력필드를 다루다 보면 특정경우에는 마우스 클릭한 자리에 특정 문구를 대입하는 기능을 구현하고 싶은 경우가 있습니다. 그럴때는 아래 함수를 활용하시면 됩니다. function setTextToPos(str) { var textarea = document.getElementById("textarea"); var curStart = textarea.selectionStart; let x = $("#textarea").val(); $("#textarea").val(x.slice(0, curStart) + str + x.slice(curStar..

[javascript/jquery] jquery color picker plugin / jquery 색상 선택 플러그인 웹사이트를 개발하다보면 jquery 플러그인을 활용하는것은 기본적인 사항이 된듯 합니다. 그중에서 색상을 선택하도록 하는 color picker 를 사용하는 경우에 어떤걸 사용해야 하는지 검색을 해야하는데요 그럴때 여러가지 color picker plugin 이 다양하게 나열되어 있는 사이트를 찾아서 공유하려고 합니다. 아래 링크 들어가보시면 여러가지 플러그인들 중 원하시는것을 데모로 체험하고 다운받아서 적용하시면 됩니다! 적용방법도 그리 어렵지 않으니 금방 적용하실 겁니다! 참고들 하세요! jquery color picker plugin list : https://www.jquerys..

[javascript/jquery] jquery flip book plugin / jquery 책넘김 효과 라이브러리 [링크] javascript 를 사용하다보면 jquery 플러그인을 잘 이용해야 하는 경우가 있습니다. 그중에서 pdf 를 책넘김과 같은 효과를 주어야 하는경우가 있는데요, 그럴때는 flip-book 플러그인이 있어서 공유하려고 합니다. 책넘김과 같은 효과 밑 책 이울이기도 되는 플러그인이라 잘 활용하면 많은 도움이 되실듯 합니다! 아래 링크 들어가서 확인해보시면 될듯 합니다. 참고들 하세요! jquery flip book plugin : https://github.com/iberezansky/flip-book-jquery GitHub - iberezansky/flip-book-jquer..

[javascript/jquery] jquery 요소에 설정된 이벤트 확인하는 방법 jquery 에서 특정 요소에 이벤트가 설정되어 있는지 확인을 해야 하는 경우가 있습니다. 그럴때는 아래와 같이 확인이 가능합니다. var event = $._data(element, 'events'); 예를들어 아래와 같이 id_btn 이라는 아이디를 가지는 버튼이 있다고 가정하고, 테스트 버튼입니다. 위 버튼에 설정되어 있는 이벤트를 확인하고 싶으면 아래와 같이 jquery 를 사용하시면 됩니다! var event = $._data($("#id_btn")[0], 'events'); 참고들 하세요!