Stack Overflow
Stack Overflow

Questions tagged [react-slick]

Questions involving the library react-slick

react-slick is the port of the jQuery slick library to react.

281 questions
2
votes
3 answers

React-Slick - transform: translate3d - Not working on smaller resolutions

I am using next.js and fetching data via API to slides. React-slick works great until the first break point on lower resolution (890px in this example). .slick-track class has a property that is causing this problem. .slick-track {transform:…
Goran Kukic
  • 43
  • 6
2
votes
0 answers

React-slick not sliding attimes

I am new to react-slick initially before i added more components to the react-slick, it was sliding seamlessly but after adding in more code in the slider, (something which i think is not the problem) react-slick now slides for some time, and then…
jeho Ntanda
  • 53
  • 1
  • 8
2
votes
0 answers

How to show the current slide and total slides with react-slick

Even following different examples I can't apply the solution. Here are some sites I…
user18966075
2
votes
1 answer

problem with react slick: import { baseUrl } from "./config

After having imported everything and installed, I copy and paste any carousel of the code offered by the page, managing to work with the exception of this, the main problem being "baseUr"After having imported everything and installed, I copy and…
Argus
  • 21
  • 2
2
votes
0 answers

React Slick Unexpected Token

I want to add react-slick by following it's documentation but "Unexpected token" keeps showing, i just want the react-slick work and styling it later. I'm really sorry i know this is very basic but i've browsing long enough until i ended up here,…
Marviano
  • 117
  • 11
2
votes
0 answers

How to put react slick dots and custom arrows in the same line?

I'm trying to integrate the react-slick dots with custom arrows from material UI icons, but both of them don't seem to integrate in a straight line with dots in middle, and arrows on left and right of the end dots. Since the number of images may…
Min Yoongi
  • 396
  • 5
  • 16
2
votes
0 answers

React Slick problem with video playing on center mode because multiple video on top on original

Here, @drorsun has explained the issue: https://github.com/akiran/react-slick/issues/300 and here is the sandbox to play with: https://codesandbox.io/s/slick-slider-react-slick-bug-with-video-forked-967b5?file=/src/index.js So what's happening here…
yathomasi
  • 458
  • 1
  • 6
  • 16
2
votes
3 answers

How to call useEffect when browser is resized

I needed bootstrap cards of equal heights inside a react-slick carousel. I found a solution from the following post: React Slick Slide Height Issue Below is my code, which records the height of the carousel div containing the bootstrap cards. The…
inquisitivemongoose
  • 340
  • 4
  • 12
2
votes
0 answers

uesRef and react-slick doesn't render when refresh

I'm new to react, I'm trying to make a slider with custom arrows, using SlickNext() and slickPrev() the problem is whenever I refresh the page or hit ctrl+R the slider disappears, it only shows whenever I modify the code or delete the ref and hit…
hey_mimi
  • 21
  • 4
2
votes
1 answer

Define callback ref TypeScript and react-slick library

I'm building a React app using TypeScript. I'm using React-Slick's carousel. I'm trying to programmatically change the slide of the carousel. Therefore I followed the documentation and tried to create a ref for the Slider. My component is like…
Tjax
  • 323
  • 1
  • 5
  • 12
2
votes
1 answer

react-slick - disable animation that traverses the slides in between when sliding to a non-adjacent slide

I am using React-Slick to display a carousel of 4 images. The settings I have are: { dots: true, infinite: true, autoplay, speed: 1000, autoplaySpeed: 5500, slidesToShow: 1, slidesToScroll:…
Seb Orel
  • 171
  • 1
  • 2
  • 5
2
votes
1 answer

How to override React Slick classes in a styled-component?

I have a React slick carrousel that I try to style to my convenience. I have wrapped the Slider component in a styled component, but I can't override any style of any classes. Here is what I write: const StyledSlider =…
DoneDeal0
  • 5,273
  • 13
  • 55
  • 114
2
votes
1 answer

How to style React Slick carrousel's arrows?

I trying to create a carrousel component that would take 100% width & height of a parent container (it should be able to go fullscreen). I have added a custom-arrow but I can't style it. How to achieve such a result? Here is my code and a…
DoneDeal0
  • 5,273
  • 13
  • 55
  • 114
2
votes
1 answer

How to add Button or Text on react-awsome-slider

I am new in react and trying to use react awsome slider its working fine but i want to add button and text on slider image but dont know how to do that. Here is my slider component import React, { Component } from 'react' import slider1 from…
dhananjay
  • 47
  • 6
2
votes
1 answer

React-slick slider test case error - cannot read property 'querySelectorAll'

I am using next.js for React project and used react-slick slider plugin it's working properly but when I try to run test it through - `TypeError: Cannot read property 'querySelectorAll' of null. For test setup I used this configuration. TypeError:…
Sunil Kashyap
  • 2,946
  • 2
  • 15
  • 31
1 2 3
…
18 19