From 21f7ba37ca0e2578e490c3c60892016cf174ab05 Mon Sep 17 00:00:00 2001 From: Antonio Laguna Date: Thu, 2 Mar 2017 10:35:14 +0100 Subject: [PATCH] Updating the docs --- CHANGELOG.md | 9 +++++++++ README.md | 15 ++++++++++++++- docs/technical.md | 19 +++++++++++++++---- 3 files changed, 38 insertions(+), 5 deletions(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index d84f917..0a60edb 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,3 +1,12 @@ +# 1.2.0 (2017-03-02) + +## New Features + +- [[#48](https://github.com/jlantunez/webslides/issues/48)] Allows to navigate with AvPag & RePag to allow presentation devices to work. +- [[#49](https://github.com/jlantunez/webslides/issues/49)] Allowing to go to first and last slides by using home and end keys respectively. +- [[#50](https://github.com/jlantunez/webslides/issues/50)] Using the keyboard on inputs and editable content won't trigger any events that might cause navigation. +- [[#47](https://github.com/jlantunez/webslides/issues/47)] Allowing options to be configured. [Read More](/docs/technical.md#options). + # 1.1.0 (2017-02-28) ## Bugfixes diff --git a/README.md b/README.md index 550a0fe..bc86c25 100644 --- a/README.md +++ b/README.md @@ -14,7 +14,7 @@ Simply choose a demo and customize it in minutes. Latest version: [webslides.tv/ ### Why WebSlides? Good karma and productivity. Just a basic knowledge of HTML and CSS is required. Designers, marketers, and journalists can now focus on the content. -### Features +## Features - Navigation (horizontal and vertical sliding): touchpad, keyboard shortcuts, and swipe. - Slide counter. @@ -27,6 +27,19 @@ Good karma and productivity. Just a basic knowledge of HTML and CSS is required. - Fonts: Roboto, Maitree (Serif), and San Francisco. - Vertical rhythm (use multiples of 8). +### Key Navigation + +There's a handful of keys that can be used to achieve navigation within WebSlides. Here's the list: + +* `←`: If WebSlides is not vertical, it will go to the previous slide. +* `→`: If WebSlides is not vertical, it will go to the next slide. +* `↑`: If WebSlides is vertical, it will go to the previous slide. +* `Page Up`: Go to the previous slide. +* `Page Down`: Go to the next slide. +* `Space`: Go to the next slide. +* `Home`: Go to the first slide. +* `End`: Go to the last slide. + ## Markup - Code is clean and scalable. It uses intuitive markup with popular naming conventions. There's no need to overuse classes or nesting. diff --git a/docs/technical.md b/docs/technical.md index 85f5e3b..f04cb72 100644 --- a/docs/technical.md +++ b/docs/technical.md @@ -25,11 +25,18 @@ WebSlides constructor accepts an object with options. |-----------|----------------|-----------|-------------------------------------------------------------------------------| | `autoslide` | `number` or `boolean` | `false` | Amount of milliseconds to wait to go to next slide automatically. | | `changeOnClick` | `boolean` | `false` | If true, clicking on the page will go to the next slide unless it's a clickable element. See [ClickToNav docs](./click-to-nav.md) for more info. | +| `minWheelDelta` | `number` | `40` | Controls the amount of scroll needed to trigger a navigation. Lower this number to decrease the scroll resistance. | +| `scrollWait` | `number` | `450` | Controls the amount of time needed to wait for a scroll transition to happen again. | +| `slideOffset` | `number` | `50` | Amount of sliding needed to trigger a new navigation. | ```javascript const ws = new WebSlides({ - autoslide: false + autoslide = false, + changeOnClick = false, + minWheelDelta = 40, + scrollWait = 450, + slideOffset = 50 }); ``` @@ -103,9 +110,13 @@ Registers a plugin to be loaded when the instance is created. It allows Those being: - - Navigation - - Hash - - Keyboard +- ClickNav +- Grid +- Hash +- Keyboard +- Navigation +- Scroll +- Touch | Param | Type | Description | | --- | --- | --- |