File tree Expand file tree Collapse file tree 1 file changed +22
-0
lines changed Expand file tree Collapse file tree 1 file changed +22
-0
lines changed Original file line number Diff line number Diff line change @@ -63,6 +63,8 @@ var SimpleSlider = React.createClass({
63
63
| className | String | Additional class name for the inner slider div | Yes |
64
64
| adaptiveHeight | bool | Adjust the slide's height automatically | Yes |
65
65
| arrows | bool | Should we show Left and right nav arrows | Yes |
66
+ | nextArrow | React Component | Use this component for the next arrow button | Yes |
67
+ | prevArrow | React Component | Use this component for the prev arrow button | Yes |
66
68
| autoplay | bool | Should the scroller auto scroll? | Yes |
67
69
| autoplaySpeed | int | delay between each auto scoll. in ms | Yes |
68
70
| centerMode | bool | Should we centre to a single item? | Yes |
@@ -94,6 +96,26 @@ var SimpleSlider = React.createClass({
94
96
| beforeChange | function | callback function called before the current index changes | Yes |
95
97
| slickGoTo | int | go to the specified slide number
96
98
99
+ ### Custom next/prev arrows
100
+
101
+ To customize the next/prev arrow elements, simply create new React components and set them
102
+ as the values of nextArrow and prevArrow.
103
+
104
+ ````
105
+ class LeftNavButton extends React.Component {
106
+ render() {
107
+ return <button {...this.props}>Next</button>
108
+ }
109
+ }
110
+
111
+ ````
112
+
113
+ Important: be sure that you pass your component's props to your clickable element
114
+ like the example above. If you don't, your custom component won't trigger the click handler.
115
+
116
+ You can also set onClick={this.props.onClick} if you only want to set the click handler.
117
+
118
+
97
119
### Development
98
120
Want to run demos locally
99
121
```
You can’t perform that action at this time.
0 commit comments