showing results for - "how to use nivo slider in react"
Leni
24 Oct 2020
1//how to use nivo carousel in ReactJS
2
3// below is App.js
4
5// import jquery
6
7import jQuery  from 'jquery';
8
9// launch function
10jQuery(document).ready(function(){
11    jQuery('#slider').nivoSlider({
12        prevText: '',
13        nextText: '',
14        controlNav: false,
15        pauseOnHover: false,
16        pauseTime: 6000,
17        animSpeed: 1500
18    });
19});
20
21// copy and paste the nivo carousel jQuery version's code here.
22//here
23// end of App.js
24
25// on the component
26<div className="container-fluid vh-100 banner-box">
27  <div  id="slider"  className="nivoSlider templatemo_slider">
28    <img src="img/0.jpg" alt="img"/>
29    <img src="img/1.jpg" alt="img"/>
30    <img src="img/2.jpg" alt="img"/>
31    <img src="img/3.jpg" alt="img"/>
32  </div>
33</div>
34