찐망고'S 퍼블리싱그리고디자인

안녕하세요 찐망고입니다. 거두절미하구 포스팅 시작! https://www.imele.co.kr/ 아이멜리 건강하고 아름다운 삶을 위한 라이프 케어, 아이멜리 www.imele.co.kr 학생이 여기 있는 Best Product섹션의 슬라이드를 따라하고 싶어해서 만들어보았습니다. 아 저 사이트는 slick을 사용하였는데 이번반 slick적용하는 수업을 안했음.. 그래서 swiper로 만들어 볼게요~ 일단 두개의 swiper를 만들어서 swiper.controller.control를 이용해서 연결해보려고 했는데.. 실패했습니다. 계속 충돌해서 swiper-slide-active가 움직이지 않고 고정되는 바람에.. 🤣🤣 그래서 사용한 방법 // HTML 피부에 전하는 청귤 세럼의 빛 2주 잡티 이별 세럼 청귤..

이번 반 예제 클론 코딩은 https://www.century21cc.co.kr/ 였는데... 개인적으로 사이트 내 단점을 수정하면서 예제로 쓰고있다. 반응형 예제로 쓰기엔 나쁜 레이아웃이지만 뭐 마크업이 불가능한 레이아웃은 아니므로... 저 섹션 부분 왼쪽 그림이 swiper를 이용해서 fade처리되면서 세번 넘어가게 작업 되어 있길래 따라해 보았습니다. 참고 swiper demo link swiper-effect-creative CodeSandbox is an online editor tailored for web applications. codesandbox.io // HTML // CSS .food-sec .img-slider { float: left; max-width: 60%; padding-..

안녕하세요 찐망고입니다. 오랜만...이라는 글을 언제쯤 안 쓸 수 있을까요? 중요한 건 제 모든 포스팅이 예약 포스팅이라는 겁니다..🤣 오늘은 swiper슬라이더에 관련된 포스팅을 하려고 합니다. 제가 수업예제를 할 때 dbcut이나 gdweb에 올라온 사이트들을 참고하는데요. 늘 업데이트되어있는 사이트를 보고 기본적인 기초 수업이 끝난 후에 반응형 사이트 하나 적응형 사이트 하나를 예제로 같이 만들어봐요. 예제는 일 년에 한 번씩 바꾸는 것 같고요.. 일 년이 넘어가면 유행이 지난 느낌이랄까 ㅎㅎ 하루하루 업데이트된 사이트를 보다 보면 그때그때 유행하는 스타일이나 효과등을 확인할 수 있는데요. 포스팅 주제가 swiper다 보니 슬라이더 위주를 보자면 arrow버튼은 필수고 pagination에 스크롤과..

안녕하세요 찐망고입니다. slick slider 세 번째 포스팅이네요.. 오늘은 slick API 중 customPaging 이용하여 dots의 모양을 numbering모양으로 변경해 보겠습니다. 더보기 제가 요즘 insta도 시작하고 youtube준비도 해야 하고 수업도 하고 있어서 매일매일 포스팅이 너무 힘듭니다. 어휴 제가 원래 계획 없이 무리해서 일을 저지르는 스타일이라.. 그래도 좋은 내용으로 포스팅하게 노력해보겠습니다 수업 중에는 이렇게 슬라이더를 일일이 하나씩 예제 삼아 하진 않고요. 선생님 이 슬라이드가 만들고 싶습니다!라고 하면 그냥 똑같이 만듭니다 ㅋㅋㅋㅋㅋㅋㅋㅋㅋ 자 코드 펜을 가봐야죠? https://codepen.io/jjinMangKo/pen/LYygOrq 오늘은 slick-sl..

안녕하세요 찐망고입니다. 2021.08.02 - [마크업/플러그인] - 슬라이드 플러그인 Slick - API (1) 슬라이드 플러그인 Slick - API (1) 안녕하세요.. 찐망고입니다. 매일매일 포스팅하는 게 참 쉬운 게 아니네요.. 자료는 많은데 취합해서 포스팅한다는 게.. 말이죠 오늘은 슬라이드 관련 포스팅을 해보려고 합니다. 마크업 퍼블리 uiweb.tistory.com 오늘은 slick-slider 관련 두 번째 포스팅입니다. 생각해보니 이전 글처럼 포스팅을 하면 slick글만 한 20개도 쓸 수 있을 것 같아요..ㅋ 오늘은 슬릭을 이용해서 이미지를 100% 넣는 방법에 대해서 알려드릴 거고요~ dots부분도 한번 건드려 보도록 하겠습니다. https://codepen.io/jjinMang..

안녕하세요.. 찐망고입니다. 매일매일 포스팅하는 게 참 쉬운 게 아니네요.. 자료는 많은데 취합해서 포스팅한다는 게.. 말이죠 오늘은 슬라이드 관련 포스팅을 해보려고 합니다. 마크업 퍼블리싱 블로그인데.. 요소는 시멘틱 요소만 해놓고.. 플러그인이라니... 요즘 제가 자주 쓰는 플러그인이 두 가지인데요 하나는 slick이 있고 또 하나는 swiper입니다. 머 나름 다른 것들도 많이 쓰긴 했지만요.. bx라거나 owl 이런 옛날 옛적 플러그인은 안녕..~ 마크업을 할 때 사용하는 플러그인들은 더 강력한 애니메이션을 만들기 위한 도움을 줍니다 그들이 제공하는 API만 잘 사용하면 더 디테일한 슬라이드 작업이 가능하죠. 솔직히 제가 블로그를 만든 가장 큰 이유 중에 하나가 그런 것들을 제공하기 위해서도 한몫..