From acec5cc25d3d88d4631f9523cc43ef9e3b76691d Mon Sep 17 00:00:00 2001 From: hyperstown Date: Sat, 16 Sep 2023 12:57:36 +0200 Subject: [PATCH] add nav buttons functionality --- README.md | 3 +++ swipe.js | 16 ++++++++++++++++ 2 files changed, 19 insertions(+) diff --git a/README.md b/README.md index bc130fd..bdcc7e6 100644 --- a/README.md +++ b/README.md @@ -113,6 +113,9 @@ Swipe can take an optional second parameter – an object of key/value settings: | **disableScroll** | Boolean | false | prevent any touch events on this container from scrolling the page. | | **stopPropagation** | Boolean | false | stop event propagation. | | **draggable** | Boolean | false | listen to mouse events in addition to the touch events | +| **navButtons** | Boolean | false | adds navigation buttons to the slider | +| **navNextText** | String | 'next' | next navigation button text | +| **navPrevText** | String | 'previous' | previous navigation button text | | **ignore** | String | null | ignore touch events on any element matching this selector | | **callback** | Function | null | runs at slide change. Three parameters are passed to the function: `index` (the current slide index)`elem` (the current slide element) and `dir` (direction: `1` for left or backward`-1` for right or forward). | | **transitionEnd** | Function | null | runs at the end of a slide transition. Two parameters are passed to the function: `index` (the current slide index) and `elem` (the current slide element). | diff --git a/swipe.js b/swipe.js index e4e8602..cccf27a 100644 --- a/swipe.js +++ b/swipe.js @@ -146,6 +146,22 @@ if (!container) return; var element = container.children[0]; + + if (options.navButtons) { + var nextButton = _document.createElement('button'); + nextButton.className = 'swipe-next'; + nextButton.textContent = options.navNextText ||'next'; + nextButton.addEventListener('click', next); + + var prevButton = _document.createElement('button'); + prevButton.className = 'swipe-prev'; + prevButton.textContent = options.navPrevText || 'previous'; + prevButton.addEventListener('click', prev); + + element.insertAdjacentElement('afterend', nextButton); + element.insertAdjacentElement('afterend', prevButton); + } + var slides, slidePos, width, length; var index = parseInt(options.startSlide, 10) || 0; var speed = options.speed || 300;