목록swiper (3)

깜놀하는 해므찌로

Angular Swiper silde custom 앵귤러 스와이프 슬라이드 커스텀 예시

요기!! 0{{number}} 1. AfterView 시점에서 핸들링하기 위해 #item 명시 import { CommonModule } from '@angular/common'; import { AfterViewInit, CUSTOM_ELEMENTS_SCHEMA, ChangeDetectorRef, Component, ElementRef, HostListener, OnInit, ViewChild, signal, } from '@angular/core'; import { register } from 'swiper/element/bundle'; import Swiper from 'swiper'; import { IconComponent } from '../../../components/icon/icon.co..
IT 2023. 7. 7. 19:24
Swiper silde vertical 수직 슬라이드 구현 예시 / 랜덤 이미지 가져오기 / tailwind group class 이름 가져오기

// 클래스 명 = 'group' 설정 // 그룹 클래스 내에 '.swiper-slide-next' 라는 클래스가 있다면 felx 없다면 hidden {{video.title}} {{video.year}} 0. init="flase" 스와이퍼를 커스텀한 대로 적용하기 전까지 임의로 스와이퍼를 그리지 말라는 지시 1. 템플릿: 슬라이드 구현을 위해 swiper-container, swiper-slide 태그를 사용 전용 태그를 사용하지 않고 div 만으로도 구현이 가능합니다. 제일 하단 참조! import { CommonModule } from '@angular/common'; import { CUSTOM_ELEMENTS_SCHEMA, Component, OnInit } from '@angular/core..
IT 2023. 6. 30. 12:43
Angular Swiper 활용 예시

import { CommonModule } from '@angular/common'; import { AfterViewInit, CUSTOM_ELEMENTS_SCHEMA, Component, ElementRef, OnInit, ViewChild, Input, } from '@angular/core'; import Swiper, { SwiperOptions } from 'swiper'; import { IconComponent } from '../../../components/icon/icon.component'; import { ScrollAnimationDirective } from '../../../animations/scroll-animation/scroll-animation.directive'; ..
IT 2023. 6. 2. 23:01
이전 Prev 1 Next 다음