반응형 juqery2 [Jquery] 반응형 웹에서 jquery 다르게 불러오는 방법 디바이스 크기 마다 jquery 를 다르게 불러오는 방법입니다. 기본구조 $(window).resize(function(){ if (window.innerWidth > 640) { // 현재 띄워진 창 크기가 640px 이상일때 /* 640 이상일때의 스크립트 */ } else { /* 640 이하일때의 스크립트 */ } }).resize(); 예제 pc화면에서는 3개씩 나타나게 하는 더보기 버튼이 모바일에서는 2개씩 나타나게 해보았습니다. html 구조 리뷰텍스트 내용 리뷰텍스트 내용 리뷰텍스트 내용 리뷰텍스트 내용 리뷰텍스트 내용 리뷰텍스트 내용 리뷰들이 나타나게 html 을 ul li 로 구성 해 놓은 상태입니다. js부분 $(window).resize(function(){ if (window.in.. 2022. 11. 11. [Jquery] Swiper Slider 이용해서 쉽게 슬라이드 사용하기 1. swiper 라이브러리를 복사해서 head 안에 넣어줍니다. 2. 슬라이드 할 HTML 코드를 작성합니다. Slide 1 Slide 2 Slide 3 3. 하단 body 끝나는 윗지점에 script를 넣어줍니다. 4. 결과 3단계로 간단히 만들었구요, 옵션을 사용해서 사용하고 싶은대로 옵션 스크립트를 수정해주면 됩니다. swiper 옵션정리 slidesPerView : 'auto', // 한 슬라이드에 보여줄 갯수 spaceBetween : 6, // 슬라이드 사이 여백 loop : false, // 슬라이드 반복 여부 loopAdditionalSlides : 1, // 슬라이드 반복 시 마지막 슬라이드에서 다음 슬라이드가 보여지지 않는 현상 수정 pagination : false, // pager.. 2022. 8. 4. 이전 1 다음 반응형
