728x90 반응형 slide2 [swiper] slide 실행 시 콜백(callback) 이벤트 스와이퍼 슬라이드 실행 시 이벤트 설정 [html] Slide 1 Slide 2 Slide 3 Slide 4 Slide 5 [css] .swiper { width: 300px; height: 200px; } .swiper-slide { background: skyblue; text-align: center; } .text{ width: 300px; height: 100px; margin: 0 auto; } [js] var swiper = new Swiper(".mySwiper", { navigation: { nextEl: ".swiper-button-next", prevEl: ".swiper-button-prev", }, speed: 1000, loop: true, on: { slideChange: fu.. 2023. 7. 19. [jQuery] 마우스 오버(hover) 내려오는 드롭 메뉴 제이쿼리(jQuery)를 이용하여 마우스 오버(hover) 내려오는 slide down 드롭 메뉴 만들기 [html] menu1 drop menu2 drop menu3 drop [css] ul{ display: flex; gap: 10px; } li{ position: relative; width: 100px; list-style: none; background: yellowgreen; } .drop-menu-wrap{ display: none; position: absolute; width: 100%; height: 60px; background: skyblue; } [js] $(document).ready(function(){ $('nav > ul > li').mouseover(function(){ .. 2023. 6. 6. 이전 1 다음
