프론트엔드-코드 237

슬라이드 애니메이션

$(document).ready(function(){ setInterval(function(){ $('#slide > ul').animate({ left:'-1200px' },1000,function(){ $(this).append($(this).children().eq(0)); $(this).css({ left:'0' }) }); },2000); }); 여기서 animate의 콜백함수 자리에 css({})가 들어간거라, 보통 이런 건 설정으로 쓰여짐. 원래는 보통 jquery라도 css({}) 이거는 이동하거나 변경해주는건데, animate 콜백으로 들어가서 다른 듯.

position

position 그 자리에 고정시킴. position: absolute; 순수한. 주위 관계없이 거기에 딱 float처럼 문서 흐름에서 띄어짐. top: 20px; left: 20px; 하면 body? 화면? 이 기준으로 움직임. 근데 부모가 position: relative 면 그거 기준임. 그래서 보통 relative랑 같이 씀 근데 부모가 relative라도 float처럼 자기 자식에서는 빠짐 top, bottom, left, right 외에 margin같은건 그래도 부모기준인듯. absolute 주는 순간 margin 같은 거 안 먹음. position: relative 상대적인 top: 20px; left: 20px; 하면 부모 기준으로 움직임. 그리고 이거는 문서 흐름에도 기존에 있던 자리는 ..

탐색 선택자

$('.nav').children() 자식 $('.nav').parent() 부모 $('.nav').parents('div') 조상 중 div들 $('.nav').closest('div') 조상 중 첫번째 div $('.nav').next() .nav 다음 $('.nav').nextAll() .nav 다음 모든 요소 $('.nav').prev() .nav 이전 $('.nav').nextUntil('p') .nav부터 p전까지 $('.nav').siblings('p') 형제요소 p $('.nav').find('p') .nav 하위 요소 중 p 선택 $('div').filter('.nav') div 중 nav 클래스 선택 $('div').not('.nav') .nav가 아닌 요소 $('div').has('...