Front-End

div 태그에서 vertical-align:middle을 사용하고 싶을 때

div 태그에서 vertical-align:middle을 사용하고 싶을 때css 2012/05/18 10:41.noticePopup div.Tit {display:table; height:64px; width:418px; padding-left:65px;} .noticePopup div.Tit h1 {display:table-cell; line-height:18px; vertical-align:middle; font-size:14px; font-weight:bold; color:#1973a6;} 출처 : http://juli97.tistory.com/151

javascript 문장 줄제한 걸어서 출력하기

var content = "아아아아 아아아아 아아아아 아아아아 "; var index = content.indexOf(" ")+1;// 첫번째 은 통과 index = content.indexOf(" ",index);// 두번째 위치 계산 if(index!=-1){ /* 두번째 이 존재할경우, 부터 뒷글자 전부 자른다 */ content = content.substring(0, index); }document.write(content);

javascript 이미지 엑박시 다른이미지 대체하기

이미지 엑박뜨면 보기가 안좋은대 간단하게 엑박이 났을경우 다른 이미지로 보여주는 소스입니다. 간단한것이지만 활용적이여서 올립니다. 예제) http://l2j.co.kr/1166

jQuery img 경로 오류 시 대체 이미지 설정하기 (엑박 방지)

img 태그 엑박 방지하기Javascript 2011/11/30 15:55 html 이벤트중에 onError를 이용하면 엑박을 방지할 수 있다. onError는 윈도우나 이미지등 개체의 읽기 오류가 발생되면 이벤트 발생[출처] window.onerror 이벤트 - 윈도우나 이미지등 개체의 읽기 오류가 발생되면 이벤트 발생|작성자 밍밍한다. 위처럼 사용하면 이미지를 찾지 못할 경우 대체할 이미지로 화면에 뿌려주게 된다. jQuery로도 가능하다. $().ready(function(){ $('img).each(function(n){ $(this).error(function(){ $(this).attr('src', '대체할 이미지'); }); }); }); 간단한듯하나 테스트해보지 못했다. 원본 페이지: ht..

[HTML] 목록태그 (ul, ol, li, dl, dt, dd)

[HTML] 목록태그 (ul, ol, li, dl, dt, dd) HTML, JScript / [Study] 2009/05/12 01:37http://blog.naver.com/dionly/120068302071ul(Unordered List) : 순서 없는 목록 ol(Ordered List) : 순서 있는 목록 li(List) : 목록dl(Definition List) : 용어 정의 목록 dt(Definition Terms) : 용어 dd(Definition Description) : 용어의 설명 예시 1)무기 아이템 목록 지팡이 도검 둔기 단검 출력무기 아이템 목록 ○ 지팡이 ● 도검 ○ 둔기 ■ 단검 예시 2)무기 아이템 목록 지팡이 도검 둔기 단검 도끼 활 총 출력무기 아이템 목록 1. 지팡이 2..

jQuery ready(fn) vs load(fn)

안녕하세요 TODD입니다. 오늘은 jQuery API 중에서 ready(fn)와 load(fn)에 대해서 알아보려고 합니다. 기존에 javascript로 구현된 페이지를 보면 페이지가 load 되었을때 해당 스크립트를 실행하기위해 태그에 onload를 함수를 사용하는 코드를 종종 볼 수 있습니다. ready(fn)와 load(fn)는 와 비슷한 행동을 한다고 볼 수 있습니다. 다만 약간의 차이가 존재하긴 합니다. 차이를 알아보기에 앞서 간단하게 ready(fn)와 load(fn)에 대해서 살펴보면 다음과 같습니다. 1. ready(fn) - DOM element들이 load가 완료된 시점에 callback function을 실행합니다. 2. load(fn) - 전체 문서의 내용이 load가 완료된 후 c..

ready와 load 이벤트차이

$(document).ready(function(){  // code});브라우저에서 DOM 트리를 생성하고난 후에 실행되게 되는 코드입니다.(DOM is ready)$(window).load(function(){  // code}); 모든 include 되는 프레임들과 object들, 이미지까지 로드된 이후에 실행됩니다.document가 ready된 시점에는 DOM에 대한 접근만이 자유롭겠지만아직 브라우저에서 다른 객체들이나 이미지들을 로드하지 않은 상황이므로어떤 페이지를 사용자가 접근할 때 이미지에 대한 가공을 하려한다면 실패하게 되겠죠.하지만, window를 로드하고난 이후에 실행되는 코드들은모든 객체나 프레임들(외부 contents를 담는 프레임까지), 이미지까지 모두 로드한 이후에 실행되므로do..

javascript, jQuery로 페이지 스크롤 끝 확인

ajax를 통해서 스크롤이 페이지 끝에 도착 했을 때자동으로 로딩되는 페이지가 많은데, 스크롤이 페이지에 끝에 도착한 것을 다음과 같은 자바스크립트 구문으로 확인가능 합니다. 바디 태그에 onscroll=scrollEnd();를 붙여주면 스크롤 하면서 scrollEnd();를 통해스크롤이 화면 끝에 도달했는지를 확인 할 수 있습니다. 이것은 jQuery에서 $.scroll();을 통해 구현이 가능한데요. 다음과 같은 소스로 구현가능합니다. javascript로 구현한 코드를 jQuery를 통해 훨씬 더 간단히 구현 가능합니다:) ===================================================================================================..