|
|
| 4번째 줄: |
4번째 줄: |
| <script src="https://evewiki.kr/mainpage/swiper-10.2.0/package/swiper-bundle.min.js"></script> | | <script src="https://evewiki.kr/mainpage/swiper-10.2.0/package/swiper-bundle.min.js"></script> |
| </head></html> | | </head></html> |
| <div class="swiper sm:min-h-[58vw]">
| |
| <!----><div class="swiper-wrapper">
| |
| <!----><!----><div class="swiper-slide bg-emerald-200"></div>
| |
| <!----><!----><div class="swiper-slide bg-emerald-300"></div>
| |
| <!----><!----><div class="swiper-slide bg-emerald-400"></div>
| |
| <!----><!----><div class="swiper-slide bg-emerald-500"></div>
| |
| <!----><!----><div class="swiper-slide bg-emerald-600"></div>
| |
| <!----><!----><div class="swiper-slide bg-emerald-700"></div>
| |
| <!----></div>
| |
| <!----><div class="swiper-button-prev"></div>
| |
| <!----><div class="swiper-button-next"></div>
| |
| <!----><div class="swiper-pagination !w-auto !left-auto !right-0"></div>
| |
| </div>
| |
| <!-- swiper 슬라이드 css -->
| |
| {{#css:
| |
| .swiper .swiper-button-prev, .swiper .swiper-button-next {
| |
| opacity: 0;
| |
| transition: .3s cubic-bezier(0,0,.5,1);
| |
| background: rgba(255,255,255,.32);
| |
| }
| |
| .swiper:hover .swiper-button-prev, .swiper:hover .swiper-button-next {
| |
| opacity: 1;
| |
| }
| |
| .swiper .swiper-button-prev:hover, .swiper .swiper-button-next:hover {
| |
| background: rgba(255,255,255,1);
| |
| }
| |
| .swiper .swiper-button-prev {
| |
| left: 3rem;
| |
| }
| |
| .swiper .swiper-button-next {
| |
| right: 3rem;
| |
| }
| |
| .swiper .swiper-button-next, .swiper .swiper-button-prev {
| |
| width: 3rem;
| |
| height: 3rem;
| |
| color: #000;
| |
| border-radius: 50%;
| |
| }
| |
| .swiper .swiper-button-next:after, .swiper .swiper-button-prev:after {
| |
| font-size: 15px;
| |
| font-weight: 900;
| |
| }
| |
|
| |
| }}
| |
| <!-- content 레이아웃 날리기 --> | | <!-- content 레이아웃 날리기 --> |
| {{#css: | | {{#css: |