demun(대문블로그)

퍼블리셔/jQuery2012. 2. 4. 06:00

jQuery 를 사용하여 DOM에 있는 특정 요소를 선택하는 방법을 알아보겠습니다. 먼저 요소를 예제로 넣고 어트리뷰트 요소가 몇개가 있는지 찾아보겠습니다. 먼저 전체 예제 코드를 보겠습니다. 참고로 jquery 버젼은 최신버젼이든 예전버젼이든 작동하는데는 별문제 없으니 jquery 를 로드한다는 것만 알아두면 됩니다. link link link link link link 결과. 6개의 a 요소가 있다고 메세지 창이 떴습니다. html에는 총 6개의 a 요소가 있습니다. 우선 모든 요소를 선택하도록 $('a') 를 사용했습니다. 마찬가지로 jquery('a') 로 해도 결과는 마찬가지 입니다. a요소가 몇개 있는지 length 속성을 사용했습니다. jquery 는 찾고자 하는 선택요소가 더 많이 있을경우..

퍼블리셔/jQuery2012. 2. 3. 06:00

jquery의 선택자는 css 선택자오 동일합니다. 그래서 css를 알면 jquery선택자에서 매우 유리합니다. jquery는 모질라 파이어폭스,인터넷 익스플로러 7, 사파리와 같은 최신브라우져가 지원하는 차세대 CSS를 사용해 고급 셀렉터를 지원합니다. jQuery가 지원하는 기본 CSS 셀렉터 셀렉터 설명 * 모든 엘리먼트와 일치 E 태그명이 E인 모든 엘리먼트와 일치 E F E의 자손이면서 태그명이 F인 모든 엘리먼트와 일치 E>F E의 바로 아래 자식이면서 태그명이 F인 모든 엘리먼트와 일치 E+F E의 형제 엘리먼트로 바로 다음에 나오는 모든 엘리먼트 F와 일치 E~F E의 형제 엘리먼트로 다음에 나오는 모든 엘리먼트 F와 일치 E:has(F) 태그명이 F인 자손을 하나 이상 가지는 태그명이 E..

퍼블리셔/jQuery2012. 2. 2. 06:00

jQuery 를 좀더 학습하기 위하여 jQuery 를 연재하기로 하였습니다. 주관련 예제와 학습은 jQuery Cookbook 를 대상으로 하고 설명은 jQuery in Action 과 같이 병행할 생각입니다. 또하나는 티스토리 블로그이니만큼 연관성이 있는것은 같이 다룰려고 합니다. 첫번째 시간으로 jQuery 코드를 html 에 넣는 기본부터 시작합니다. html 에 jQuery 코드를 넣은 방법은 두가지가 있습니다. 1. jQuery 의 최신 버젼을 삽입하기 위해 구글이 호스팅하는 CDN(content delivery network)를 사용하는 방법. 2. jQuery.com 으로부터 다운로드 받아 직접 서버에 업로드후 호스팅하는 방법입니다. 참고로 구글에서 빠른 호스팅을 하니 CDN을 이용하는 방법..

티스토리스킨수정/스킨수정팁2012. 2. 1. 06:00

Stripe_Default 스킨은 제가 미리 코드를 넣어 놓은것이 몇군데 있습니다. 그래서 사용할 때는 반드시 본인것으로 수정해서 사용해야 합니다. 스프라이프 스킨이 필요하시면 배포글을 참고하세요. 수정 할 부분을 하나 하나 알려드리겠습니다. 1. 구글 메타 태그. 안에 구글 메타태그를 본인것으로 수정하세요. 구글 광고를 안하시는분은 아래 이미지의 한 줄을 그냥 삭제하시면 됩니다. 2. 소셜 링크. 아래 이미지처럼 저의 주소로 모두 되어 있으니 본인것으로 수정하시면 됩니다. 한가지 기본 RSS 주소를 사용한다면 RSS 주소는 그냥 두셔도 됩니다. 만약 피드버너등을 사용한다면 해당 주소로 변경하시면 됩니다. 3. 본문 구글 광고. 본문 위에 보여지는 구글 광고를 본인것으로 수정하세요. 아래 이미지를 보시면

티스토리/스킨배포2012. 2. 1. 06:00

대문입니다. 제가 이제까지 사용하던 스킨을 배포합니다. 오랫동안 이것 저것 만지며 테스트를 거쳐왔기 때문에 오류가 거의 없지 않나 생각됩니다. 원래 스킨명은 Stripe(스프라이프) 였는데 메인메뉴와 하단의 푸터부분을 수정하면서 그 부분을 추가한 버젼도 필요하면 배포하려고 스킨명을 Stripe_Default 로 정했습니다. 스프라이프로 이름을 정한것은 각각의 배경에 스프라이프가 들어가도록 제작하여 특징을 주었기 때문입니다. 본문의 너비는 구글 광고가 두개 들어가는 사이즈로 680px 입니다. 플로팅 메뉴가 있는 우측 사이드바는 너비가 250px 입니다. 하단에 위치한 사이드바의 너비는 왼쪽과 오른쪽 똑같이 310px 입니다. 이 스킨의 특징을 하나 하나 알려드리겠습니다. 특징. 1. 대표글꼴 - 나눔고딕..

티스토리/티스토리초대장2012. 1. 31. 06:00

티스토리 초대장이 아직 남아 있습니다. 보내드렸는데도 개설하지 않으신분은 선택취소 했습니다. 현재 16장이 남아있으니 신청해주세요. 어떤 블로그를 하실건지와 이메일을 적어주세요. i n v i t a t i o n 티스토리 초대장 + 남은 초대장 수 : 00 안녕하세요! 티스토리에 보금자리를 마련하시려는 여러분께 초대장을 배포해 드리려고 합니다. 나만의, 내 생각을, 내 기억을 담는 소중한 블로그를 만들고 싶다면 티스토리로 시작해보세요! 티스토리 블로그는 초대에 의해서만 가입이 가능합니다. 원하시는 분은 댓글에 E-mail 주소를 남겨주시면 초대장을 보내드립니다. 남겨주실 때에는 꼭 비밀댓글로 남겨주세요! 초대장을 보내드리고 바로 개설하시지 않으신 분들은 초대장을 회수할 수도 있으니 바로 개설해주세요! ..

퍼블리셔/기술2012. 1. 31. 06:00

이전에 제가 온라인 구문강조 하는 방법과 자바스크립트를 이용한 구문강조 기능에 관한 글을 쓴적이 있습니다. 이 방법은 위의 방법과는 다른 방법입니다. 특히 에디트플러스를 이용하는 방법입니다. 그리고 이 방법은 티스토리에서만 해당이 되는것이 아니라 네이버, 다음, 파란....등등 어디에서나 활용할 수 있는 방법입니다. 참고 온라인 구문강조 도구 7곳 티스토리 치환자 본문에 표시하는 방법 티스토리 구문강조(코드하이라이팅)하는 4가지 방법 설치없이 구문강조하고 티스토리 치환자 표시하는 방법 에디트플러스를 이용해서 블로그에 코드를 쓸때 구문강조하는 간단한 방법입니다. 에디트플러스를 이용하는 방법이니 에디트 플러스가 있어야겠지요. 있다치고 에디트플러스에서 복사할 코드를 전부 선택을 합니다. 그다음 마우스 우측버튼..

티스토리/티스토리가이드2012. 1. 29. 06:00

리본서식으로 첫번째는 둥근형태의 리본을 만들어 봤고, 두번째는 이미지없는 리본형태를 만들어 봤습니다. 이번에는 이미지를 활용한 리본인데요. 많이들 본 형태일겁니다. 먼저 어떤 형태인지 완성작을 한번 보세요. 사이드바에 전형적으로 사용하는 형태인데요. 이미지가 두개로 구성된것입니다. 이 방식의 장점은 너비가 커도 깨지지 않는다는 점입니다. 여기서 잠깐 참고할 점. 이미지가 한개인것은 너비가 유동적이면 사용할 수 없다는 단점이 잇습니다. 하지만 단 하나의 이미지로 사용한다는 간단한것이 장점입니다. 이미지가 두개인것은 너비가 유동적이여도 사용할 수 있다는 장점이 있습니다. 단점은 스타일을 입힐 요소(spna)가 하나 추가되어야 한다는 점입니다. 이미지가 두개인것의 장점을 알았다면 이것은 어느 스킨에나 활용할 ..

Design2012. 1. 29. 06:00

티스토리에 적용하는 리본 서식을 계속적으로 쓰고 있습니다. 오늘은 그중에서 세번째에 해당하는 겁니다. 이것도 외국사이트에서 본것인데 그럭저럭 좋은 글같아 제가 따라해보고 배포, 공유하는 겁니다. 이미지들은 제가 일단 만들어서 사용해보고, 코딩해본것입니다. 폴더의 안에는 포토샵 파일인 psd 도 포함이 되어 있습니다. 포토샵 파일인 psd 의 경우 아래에 표시된 대로 그라디언트와 리본받침의 색깔만 적절하게 조정하시면 다양하게 사용할 수 있습니다. 다운로드 받아서 압축을 해제해서 사용하세요. 참고 티스토리 리본 제목 서식 만들기 3

티스토리스킨수정/스킨수정팁2012. 1. 28. 06:00

제가 스킨을 수정하고 제작하고, 그리고 적용하면서 느낀점을 알려드립니다. 이제는 제가 스킨과 코드에 대해서 어느정도 아니까 수정이 가능하고 복구가 가능하지만 블로그를 처음하시거나, 코드를 잘 모르시는분들은 반드시 알고 넘어가야 할 부분입니다. 이점을 반드시 숙지하시고 스킨을 변경하거나 수정하거나 하세요. 이 부분을 간과하면 나중에 꼭 후회하게 됩니다. 꼭 참고하시기 바랍니다. 스킨을 수정하거나 변경하기전 제일 먼저 해야할것은 백업입니다. 1. html, css 코드 복사. 제일먼저 skin.html 과 style.css 를 먼저 에디터에 복사해서 붙여넣으세요. 그리고 알아보기 쉬운 이름으로 저장하세요.. 왜냐면 스킨을 변경한 후 코드를 붙여넣기 위함입니다. 스킨을 변경한후 코드를 붙여넣거나 수정해서 넣기..