Skip to content

Commit 16f355a

Browse files
committed
updated readme for new dots.
1 parent 9fedb93 commit 16f355a

File tree

1 file changed

+31
-3
lines changed

1 file changed

+31
-3
lines changed

README.md

Lines changed: 31 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -76,12 +76,40 @@ add as many ``<Slides:Slide>`` as you want.
7676

7777
- **loop : boolean** - If true will cause the slide to be an endless loop. The suggested use case would be for a Image Carousel or something of that nature.
7878

79-
- **pageIndicators : boolean** - If true adds indicator dots to the bottom of your slides.
80-
8179
- **disablePan : boolean** - If true panning is disabled. So that you can call nextSlide()/previousSlide() functions to change the slide. If slides is used to get details about users like email, phone number, username etc. in this case you don't want users to move from one slide to another slide without filling details.
8280

8381
- **pagerOffset : string** - Margin-top for the pager. Number or percentage, default 88%.
8482

83+
- **pageIndicators : boolean** - If true adds indicator dots to the bottom of your slides.
84+
85+
#### Indicators
86+
87+
If the property `pageIndicators` is `true` you won't see the page indicators anymore as of 2.0.0 right away. there are two css classes exposed that you can setup however you like for active and inactive indicators. below is an example for semi translucent dots.
88+
89+
```css
90+
.slide-indicator-inactive{
91+
background-color: #fff;
92+
opacity : 0.4;
93+
width : 10;
94+
height : 10;
95+
margin-left : 2.5;
96+
margin-right : 2.5;
97+
margin-top : 0;
98+
border-radius : 5;
99+
}
100+
101+
.slide-indicator-active{
102+
background-color: #fff;
103+
opacity : 0.9;
104+
width : 10;
105+
height : 10;
106+
margin-left : 2.5;
107+
margin-right : 2.5;
108+
margin-top : 0;
109+
border-radius : 5;
110+
}
111+
```
112+
85113
#### Events
86114
- **start** - Start pan
87115
- **changed** - Transition complete
@@ -101,7 +129,7 @@ To use the slides with Angular2 and the `registerElement` from `nativescript-ang
101129

102130
#### Known issues
103131

104-
* There apears to be a bug with the loop resulting in bad transitions going right to left.
132+
* There appears to be a bug with the loop resulting in bad transitions going right to left.
105133

106134
#### How To: Load slides dynamically
107135
You want to hook into the loaded event of the view and then create your view elements.

0 commit comments

Comments
 (0)