Frontend68 자식요소 이벤트를 위해 부모요소 이벤트 막는 방법 자식요소 이벤트를 사용하기 위해 부모요소 이벤트를 막는 방법 이처럼 큰 네모박스(article) 을 클릭하면 '일정 상세보기' 페이지로 가게끔 jQuery를 걸어놨지만,큰 네모박스(article) 안에 'X버튼' 또는 '일정 수정하기' 또는 '게시물로 공유하기' 와 같이 자식요소를 클릭하면 그에 맞게 이벤트가 걸려야하는데,jQuery를 잘 잡아도 부모요소의 이벤트인 '일정 상세보기' 페이지로 넘어가더라.이에 대한 해결방법은, 자식요소에 e.stopPropagation(); 사용하기 ! * 사용방법 *1. HTML 내부1234567891011 일정 수정하기 게시물로 공유하기Colored by Color Scriptercs2. jQuery 부분123456789101112131415161718//일정 클릭시 .. 2018. 7. 25. [jQuery/Bootstrap] 동적으로 생성한 요소에 tooltip 바인딩 시키기 단순하게 아래 코드 적용시켜주면 된다 :) $(document.body).tooltip({ selector: "[data-toggle='tooltip']" }); 출처 : https://code.i-harness.com/ko/q/97f5a9 2018. 7. 23. [CSS] CSS로 인스타그램 마우스오버 이벤트 적용하기 인스타그램처럼 포스팅 한 게시물에 마우스 올리면 좋아요 개수, 댓글 개수를 알려주고 싶었다. 찾아보니 CSS 로 instagram 처럼 mouseover 시 event effect 를 적용 할 수 있어서 바로 적용함. 참고 : https://www.w3schools.com/howto/tryit.asp?filename=tryhow_css_image_overlay_opacity * 사용방법 * 1. HTML 태그 ${board.boardTitle} ${board.likeCnt} ${board.commCnt} 2. HTML CSS 부분 article{ display: inline-block; position: relative; } article:hover .thumbImg img { opacity: 0.3; .. 2018. 7. 22. caret.js 와 atwho.js 이용하여 게시물에서 @로 친구리스트 불러오기 (autocomplete 활용) 페이스북이나 인스타그램처럼, 태그(@) 를 이용하여 친구리스트를 댓글에 불러올 수 있도록 하는 기능을 구현했다 !Friend 테이블에서 FriendId 만을 추출하여 JSON 형식으로 만들고, 댓글폼에서 @를 입력하면 Ajax 로 리스트를 불러와 띄워주는 예제다.해당 기능 사용을 위해 caret.js 와 atwho.js 를 같이 사용하였다.Caret.js Git 주소 : https://github.com/ichord/Caret.jsAtwho.js Git 주소 : https://github.com/ichord/At.js해당 예제는 국내 포스팅도 없고 검색 데이터도 별로없었지만 내가 사용할 textarea 에 적용이 가능하고, 사용방법이 편한 점에서 공부하고 적용했다 (뿌듯) * 사용방법 *1. HTML 상.. 2018. 7. 20. 자바스크립트로 특정 날짜와 현재 날짜 비교하여 x시간전, x분전, x초전 구현하기 특정 날짜와 현재 날짜를 비교해서 "x시간 전, x분 전, x초 전, 방금 전" 과 같은 문구를 리턴해주는 javascript 구현. 실제 돌아가는 메커니즘은 구글링만 해도 금방 나오는데, 이해하고 내꺼화하며 적용하기가 쉽지 않았다.그래도 구현하니 뿌듯함 ㅠㅠ !!!!! * 구현방법 *1. BODY 내부12cs2. 돌아가도록 선언한 JAVASCRIPT1234567891011//마지막으로 작성된 댓글시간 출력을 함수로 만들고function refreshDate(){ $("#commLastTime").text(transferTime( $("#commLastTime").attr("class") ) );} $(function(){ //마지막으로 작성된 댓글시간 출력을 함수 바로 실행 refreshDate(); .. 2018. 7. 18. 자바스크립트에서 contains 사용? 자바스크립트에선 contains 사용이 불가능하다.자바문법으로 생각하고 스크립트에 contains 썼다가 contains is not a function 에러가 나서 찾아보니,자바스크립트에서는 indexOf() 를 사용해야한다고 한다. 2018. 7. 17. 이전 1 ··· 4 5 6 7 8 9 10 ··· 12 다음
