Skip to content

Instantly share code, notes, and snippets.

@rockyahmed
Created March 30, 2021 16:32
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save rockyahmed/18c1035f7fad7a911564a623bfed52d5 to your computer and use it in GitHub Desktop.
Save rockyahmed/18c1035f7fad7a911564a623bfed52d5 to your computer and use it in GitHub Desktop.
Angular slick Slider use
===================================
Add this HTML Code
===================================
<ngx-slick-carousel class="carousel testimonial-slide" #slickModal="slick-carousel" [config]="slideConfig">
<div ngxSlickItem class="slide">
<div class="testimonial-item">
</div>
</div>
</ngx-slick-carousel>
===================================
Include this Component.ts
===================================
@ViewChild('slickModal', { static: true }) slickModal: SlickCarouselComponent;
slideConfig = {
"slidesToShow": 3,
"slidesToScroll": 3,
"autoplay": false,
"vertical": false,
"dots": true,
"infinite": true,
centerMode: true,
centerPadding: 0,
autoplaySpeed: 2000,
draggable: false,
swipe: false,
touchMove: false,
focusOnSelect: false,
accessibility: false,
responsive: [
{
breakpoint: 991,
settings: {
slidesToShow: 1,
centerPadding: '180px',
}
},
{
breakpoint: 767,
settings: {
slidesToShow: 1
}
},
{
breakpoint: 500,
settings: {
slidesToShow: 1
}
}
]
};
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment