background preloader

국내

Facebook Twitter

[JQuery 무한스크롤 이벤트] 데이타 불러오는 무한 스크롤 만들기. 머리말 모던 웹을 위한 JavaScript JQuery 입문 책을 보고 있는 데요.

[JQuery 무한스크롤 이벤트] 데이타 불러오는 무한 스크롤 만들기

데모로 구현된 JQuery 중에서 몇가지만 정리 하여 보았습니다. JQuery 기본문서 형식과 참조하는 방법입니다. JQuery 를 사용하기 위한 기초 작업입니다. JQuery 를 참조하는 방법은 2가지가 있는 데 직접 참조하는 방식과 CDN 호스트를 사용하는 방법이 있습니다. 이렇게 여러개의 파일이 있습니다. JQuery 보조 파일 마이크로소프트에서 제공하는 JQuery 보조 파일은 입니다. 미투데이(SNS)에서 자신의 생각을 적으면 바로 TextAre 에 입력할 수 있는 남은 글자수가 옆에 나오게 됩니다. (위의 그림)스크립트 부분 처럼 문서에서 textarea 태그에 keyup 이벤트를 연결합니다. 위 코드는 안에 내용입니다. h2 태그 중에서 rtext 아이디로 되어 있는 것을 선택하여 남은 글자수를 계산하여 넣어주게 되는 코드입니다.

Mixsh.com 사이트 처럼 스크롤을 내리게 되면 밑으로 스크롤이 다시 늘어나면서 나머지 데이타를 불러 오는 무한 스크롤 입니다. 위 그림은 스크립트 부분입니다. 스크롤에 이벤트를 연결합니다. 태그의 하단 부분의 코드입니다. .reverse background:Black; color:White; var foodlist = []; for(var key in foodlist) var data1 = foodlist[key].명칭 + "\t" + foodlist[key].가격 + "\n"; function fill_div() document.getElementById("testArea").innerHTML="<input type='button' />"; // 페이지를 로드할때 수행합니다. onLoad 처럼. $(document).ready(function () { // <h3>태그의 색상을 blue로 찾아서 변경해줍니다. $('h3').css('color', 'blue'); // class 를 추가합니다. $('h3').addClass('item'); $('h1').css({

RyuSeungHyun's Blog 제이쿼리(JQuery), CSS3, HTML5 효과 튜토리얼 모음. [HTML/CSS] 001.

RyuSeungHyun's Blog 제이쿼리(JQuery), CSS3, HTML5 효과 튜토리얼 모음

CSS3를 이용한 탭 메뉴(tab menu) 만들기 How to Create a CSS3 Tabbed Navigation [미리보기] [HTML/CSS] 002. CSS3를 이용한 버티컬 네비게이션 메뉴 만들기 Orman Clark’s Vertical Navigation Menu [미리보기] [HTML/CSS] 003. CSS3를 이용한 오목한 버튼 이미지 코딩하기 Tagtastic Tag Cloud with CSS Transformations [미리보기] jQuery 맛보기.