Play Ground

var url = window.location // for sidebar menu entirely but not cover treeview $('ul.sidebar-menu a').filter(function() { return this.href == url; }).parent().addClass('active'); // for treeview $('ul.treeview-menu a').filter(function() { return this.href == url; }).parentsUntil(".sidebar-menu > .treeview-menu").addClass('active'); window.location을 이용하여 url을 가져오고, 메뉴의 링크와 비교하여 같다면 active class를 추..

유튜브를 사이트에 붙이려면 원하는 동영상 가서 밑의 그림처럼 공유버튼 -> 소스코드에 있는 iframe 코드를 복사해서 사용하면 된다. 근데... 두둥재생 일시정지 중지를 따로 버튼을 만들어 제어해야하는 일이 발생하였다고 한다!그럴땐 1.src에 마지막에 ?enablejsapi=1&version=3&playerapiid=ytplayer 를 붙인다.위의 캡쳐된 소스코드로 보자면 요런식으로 작성한 후에 2. 제어할 버튼에 이벤트 추가 $(".stop").on("click", function(){ $("iframe")[0].contentWindow.postMessage('{"event":"command","func":"' + 'stopVideo' + '","args":""}', '*'); });stopVide..

네이버(http://m.naver.com) 이나 다음(http://m.daum.net)의 모바일버전을 보면 메인메뉴 영역을 스와이프해서 전체 메뉴를 훑을 수 있게 만들어졌다. 이 기능을 만들어 보고자 개발자 모드로 확인하였더니 css의 transform, transition 등을 이용해서 만든 것으로 보였다. 그래서 나는 trans관련 css와 함께 스와이프 동작을 인식해야하므로 jquery의 touchstart, touchmove, touchend를 이용해서 만들었다. 참고로 touchstart, touchmove, touchend는 마우스로는 작동이 안되고 핸드폰에서만 작동하는 것을 확인하였다.

처음 작성된 html코드는 $("#target").on("click", function(){ 이벤트 });이런식으로 작성하면 이벤트가 잘 먹었다.근데 append나 prepend, before, after로 생성한 태그에는 이벤트가 먹지 않았음! 주륵 열심히 구글링 한 결과 저 코드를 조금만 응용하면 된다고 함(참고로 1.7 이후버전) $(document).on("click", "#target", function(){ 이벤트 }); 대충 정리하면 $(document).on(1, 2, 3) 1 -> click, mouseover, keyup 등의 이벤트2 -> 타겟태그(#은 id, .은 class)3 -> 함수

나도 포폴사이트 만들 때 PPT를 올리고싶었는데 도저히 방법을 못찾아서하나하나 장인정신 펼쳐서 캡쳐하고 붙여넣고 편집하고 했는데생활코딩 그룹에 같은 고민의 글이 올라왔다 댓글들이니 참고하고 찾아보기 1. ppt file format2. http://www.microsoft.com/web/solutions/powerpoint-embed.aspx3. http://lab.hakim.se/reveal-js/#/ -> reveal.js4. slide.js, slick.js5. mssppt parser 관련 라이브러리 찾아서 ppt를 이미지 변환 하여 뿌리기

1. AddyWaddy jQuery Tag Cloud 2. IndyArmy jQuery Awesome Cloud 3. Tag Clouds – Styling and Adding Sort Options 4. DynaCloud – dynamic tag cloud with jQuery 5. jQuery Rotating 3D Tag Cloud 6. jCloud Tag Cloud Plugin 7. jQCloud Word Clouds 8. Prataes jQuery Tag Cloud 9. jQuery Tag Cloud Plugin 10. TagCanvas – HTML5 Canvas Tag Cloud 참고 : http://www.websanova.com

각종 글자 애니메이션 jquery 소스모음 (http://www.giuliandrimba.com/labs/lettering-animate/) jquery 소스천국 사이트 (http://www.htmldrive.net)

퀵메뉴1퀵메뉴2퀵메뉴3퀵메뉴4 구글링하다가 찾은 퀵메뉴 소스인데출처를 모르겠다ㅠㅠㅠ

물론 저 위의 소스보다 더 좋고 간편한 소스가 있겠지만 초보자인 내 머리에서 나오는 소스는 저 정도밖에 못짜겠다ㅠㅠ