facebook timeline 스타일 따라하기

옹갈군

· 12년 전 · 조회 2606 2606 · 댓글 6 6

링크

http://www.9lessons.info/2012/01/facebook-timeline-design-using-jquery.html (1588)

안녕하세요.

masonry.jquery와 css를 응용해서 facebook 의 timeline style을 구현하는 방법에 대하여 상세히 설명해놓은 블로그가 있어서 소개합니다.

step by step으로 상세히 설명되어 있어서 개념익히기에 충분합니다.

응용하시면 다양한 스타일의 타임라인이 구현될듯 싶습니다.

데모와 다운로드는 아래 링크를 확인부탁드립니다.

demo : http://demos.9lessons.info/timeline/index.html
download : http://demos.9lessons.info/url.php?url=https://www.box.com/s/aba00db637b4a86716da

첨부파일

timeline_html.zip (9.5 KB, 11회)

댓글 작성

댓글을 작성하시려면 로그인이 필요합니다.

로그인하기

댓글 6개

시누이

번호	제목	글쓴이	날짜	조회
5127	하이퍼링크에 여러가지 스타일만들기 [1] #개발자 #기타	senseme 프로필 보기 이 회원 글보기 이 회원의 댓글보기	12년 전	1264
5126	내 쇼핑몰에 즐겨찾기 등록 버튼 만드는 방법 #개발자 #javascript	senseme 프로필 보기 이 회원 글보기 이 회원의 댓글보기	12년 전	1787
5125	네이버 지도 API 다중마커 구현 소스 입니다. [9] #개발자 #javascript	kiplayer 프로필 보기 이 회원 글보기 이 회원의 댓글보기	12년 전	14716
5124	카운터 늘리기 방법은? [1] #개발자 #php	강진사랑 프로필 보기 이 회원 글보기 이 회원의 댓글보기	12년 전	1071
5123	웹 접근성 미준수 시 처벌 대상에 대한 노석준 교수님의 답변 [18] #웹접근성	지운아빠 프로필 보기 이 회원 글보기 이 회원의 댓글보기	12년 전	2715
5122	CASE WHEN ~ (MySQL 의 IF문 역활) [4] #개발자 #mysql	senseme 프로필 보기 이 회원 글보기 이 회원의 댓글보기	12년 전	8944
5121	웹 접근성 심사 [9] #웹접근성	프토코이 프로필 보기 이 회원 글보기 이 회원의 댓글보기	12년 전	1285
5120	정규식 사용법입니다. [5] #개발자 #php	프로프리랜서 프로필 보기 이 회원 글보기 이 회원의 댓글보기	12년 전	1180
5119	ereg_replace와 str_replace 차이점입니다. [1] #개발자 #php	프로프리랜서 프로필 보기 이 회원 글보기 이 회원의 댓글보기	12년 전	1647
5118	PHP를 이용하여 문자열을 자르는 함수 입니다. #개발자 #php	프로프리랜서 프로필 보기 이 회원 글보기 이 회원의 댓글보기	12년 전	1149
5117	숫자를 한글로 출력하게 해주는 함수 입니다. [2] #개발자 #php	프로프리랜서 프로필 보기 이 회원 글보기 이 회원의 댓글보기	12년 전	1288
5116	file_get_contents 사용법 [1] #개발자 #php	프로프리랜서 프로필 보기 이 회원 글보기 이 회원의 댓글보기	12년 전	3540
5115	PHP 변수를 스크립트로 사용하는 방법입니다. #개발자 #php	프로프리랜서 프로필 보기 이 회원 글보기 이 회원의 댓글보기	12년 전	1473
5114	PHP를 사용하여 리눅스 심볼릭 링크를 거는 방법입니다. [3] #개발자 #php	프로프리랜서 프로필 보기 이 회원 글보기 이 회원의 댓글보기	12년 전	2131
5113	플래시 위로 레이어 올리기 [2] #개발자 #기타	senseme 프로필 보기 이 회원 글보기 이 회원의 댓글보기	12년 전	1307
5112	자릿수만큼 문자열 채우기 [1] #개발자 #php	senseme 프로필 보기 이 회원 글보기 이 회원의 댓글보기	12년 전	3027
5111	웹 접근성 관련 오해글에서 언급했던 메일 내용 원문 공개 [9] #웹접근성	지운아빠 프로필 보기 이 회원 글보기 이 회원의 댓글보기	12년 전	1343
5110	장차법 대상인 사이트 제작시 [15] #웹접근성	임소야 프로필 보기 이 회원 글보기 이 회원의 댓글보기	12년 전	1597
5109	웹 접근성 관련 오해 2가지 [21] #웹접근성	지운아빠 프로필 보기 이 회원 글보기 이 회원의 댓글보기	12년 전	2024
5108	공백제거 #개발자 #javascript	senseme 프로필 보기 이 회원 글보기 이 회원의 댓글보기	12년 전	1047
5107	셀렉트박스 간편하게 만들기 [1] #개발자 #php	senseme 프로필 보기 이 회원 글보기 이 회원의 댓글보기	12년 전	1081
5106	403에러에 대처하는 자세. [1] #개발자 #웹서버	카츠 프로필 보기 이 회원 글보기 이 회원의 댓글보기	12년 전	4427
5105	게시판의 페이징 방법 [2] #개발자 #php	senseme 프로필 보기 이 회원 글보기 이 회원의 댓글보기	12년 전	1486
5104	이미지에 워터마크 처리하기 [2] #개발자 #php	senseme 프로필 보기 이 회원 글보기 이 회원의 댓글보기	12년 전	1623
5103	Chrome 를 이용한 모바일모드 [10] #개발자 #mobile	레드베어 프로필 보기 이 회원 글보기 이 회원의 댓글보기	12년 전	5480

facebook timeline 스타일 따라하기

링크

첨부파일

댓글 작성

댓글 6개

게시판 목록

팁게시판

하이퍼링크에 여러가지 스타일만들기 [1]

내 쇼핑몰에 즐겨찾기 등록 버튼 만드는 방법

네이버 지도 API 다중마커 구현 소스 입니다. [9]

카운터 늘리기 방법은? [1]

웹 접근성 미준수 시 처벌 대상에 대한 노석준 교수님의 답변 [18]

CASE WHEN ~ (MySQL 의 IF문 역활) [4]

웹 접근성 심사 [9]

정규식 사용법입니다. [5]

ereg_replace와 str_replace 차이점입니다. [1]

PHP를 이용하여 문자열을 자르는 함수 입니다.

숫자를 한글로 출력하게 해주는 함수 입니다. [2]

file_get_contents 사용법 [1]

PHP 변수를 스크립트로 사용하는 방법입니다.

PHP를 사용하여 리눅스 심볼릭 링크를 거는 방법입니다. [3]

플래시 위로 레이어 올리기 [2]

자릿수만큼 문자열 채우기 [1]

웹 접근성 관련 오해글에서 언급했던 메일 내용 원문 공개 [9]

장차법 대상인 사이트 제작시 [15]

웹 접근성 관련 오해 2가지 [21]

공백제거

셀렉트박스 간편하게 만들기 [1]

403에러에 대처하는 자세. [1]

게시판의 페이징 방법 [2]

이미지에 워터마크 처리하기 [2]

Chrome 를 이용한 모바일모드 [10]