qwef

.slide{width: calc(100% - 300px);} 연산식 중간에 떨어트리셈 100 - 300

vw 뷰포트 넓이기준 vh 뷰포트 높이 기준

let top = $('.outer').scrollTop(); console.log(top); let left = $('.outer').scrollLeft(); console.log(left); 스크롤 값 가져오기. $('.outer').scroll(function(){ top = $('.outer').scrollTop(); left = $('.outer').scrollLeft(); $('.info span').text(` top: ${top}, left : ${left} `); }); 스크롤 시 이벤트 $('button').click(function(){ $('.outer').scrollTop(250).scrollLeft(250); }); 스크롤 값 set

$('#box1').prepend('삽입된 내용1'); $('#box1').append('삽입된 내용2'); $('#box1').before('자신의 앞에 삽입된 내용1'); $('#box1').after('자신의 뒤에 삽입된 내용1'); 이렇게 태그도 넣을 수 있음. $('삽입된 내용1').prependTo('#box2'); $('삽입된 내용2').appendTo('#box2'); $('자신의 앞에 삽입된 내용').insertBefore('#box2'); $('자신의 뒤에 삽입된 내용').insertAafter('#box2'); To는 넣을 대상

console.log( $('.box').offset().left ); offset() html 기준으로 left, top등의 위치를 return함 아마 margin만큼? 인듯..? console.log($('.box').position().left); position() 부모를 기준으로 left, top등의 위치를 반환 부모의 margin, padding, border 포함해서 그 위치 left띄어진 것. margin, padding, border까지가 부모니 그거 다포함한 바깥의 left가 left니 $('.box p').offset({left:150, top:100}); 이렇게 변경할 수 있음

$('div').eq(0).css({ padding: '10px', textAlign: 'center' }); $('div').css('width',function(index){ return (index + 1)*(100+100); }); 이거 div가 여러개라서 반복문처럼 돌아감.

attr은 속성값 그 자체로, prop()는 bool식으로 제어용도로 사용함. 그래서 checked나 disable 같은 bool 형식이 값인 속성을 다룰 때 많이 사용. $('input:checkbox').eq(0).attr('checked','checked'); $('input:checkbox').eq(1).prop('checked', true); 근데, $('input:checkbox').eq(1).attr('checked', true); 이것도 되긴 함.. 이 둘의 차이는, attr은 true를 문자열로 전달한다고 함. 이 bool속성이 아닌 문자열이 브라우저 호환이라던지 문제가 있을 수 있다고 함. 그리고, html에서 checked나 disabled같은 bool속성은 일반적으로 값이 있는게 아..

태그의 속성 console.log($('.site a:eq(0)').attr('href')); 속성 가져오기. $('.site a:eq(1)').attr('href','http://google.com'); 속성 주기 $('.site a').attr('title', function(){ return '새창열기'; }); 이것도 가능. 'title' 에 function의 return을 줌.

let text = 'javascript'; $('#m3').html(` ${text} ${text} ${text} `); 직접 저렇게 태그 넣는것도 가능. 백엔드에서 스타일 넣을 땐 그냥 이렇게 넣음

ul같은 리스트 등은.. 목록이나 혹은 순서가 필요한 그런 거 만들때만 쓰는 거 인 듯.. 이미지 슬라이드나.. 이미지 슬라이드도 일종의 목록? 이니까.. 딱히 그런 목록이 아니고 목록같이 보여도 그냥 보이기만 하는 건 div로 묶으면 됨.