tweaked mouse wheel navigation
This commit is contained in:
parent
17854e892b
commit
38b229a22f
3 changed files with 36 additions and 26 deletions
|
@ -33,6 +33,9 @@ Reveal.initialize({
|
|||
// If true; each slide will be pushed to the browser history
|
||||
history: true,
|
||||
|
||||
// Flags if mouse wheel navigation should be enabled
|
||||
mouseWheel: true,
|
||||
|
||||
// Apply a 3D roll to links on hover
|
||||
rollingLinks: true,
|
||||
|
||||
|
@ -55,6 +58,7 @@ Reveal.initialize({
|
|||
- CSS is now much more explicit, rooted at #reveal, to prevent conflicts
|
||||
- Config option for disabling updates to URL, defaults to true
|
||||
- Anchors with image children no longer rotate in 3D on hover
|
||||
- Support for mouse wheel navigation ([naugtur](https://github.com/naugtur))
|
||||
|
||||
#### 1.1
|
||||
|
||||
|
|
|
@ -227,6 +227,9 @@
|
|||
// If true; each slide will be pushed to the browser history
|
||||
history: true,
|
||||
|
||||
// Flags if mouse wheel navigation should be enabled
|
||||
mouseWheel: true,
|
||||
|
||||
// Apply a 3D roll to links on hover
|
||||
rollingLinks: true,
|
||||
|
||||
|
@ -239,5 +242,6 @@
|
|||
|
||||
hljs.initHighlightingOnLoad();
|
||||
</script>
|
||||
|
||||
</body>
|
||||
</html>
|
54
js/reveal.js
54
js/reveal.js
|
@ -54,6 +54,7 @@ var Reveal = (function(){
|
|||
history: false,
|
||||
transition: 'default',
|
||||
theme: 'default',
|
||||
mouseWheel: true,
|
||||
rollingLinks: true
|
||||
},
|
||||
|
||||
|
@ -70,7 +71,10 @@ var Reveal = (function(){
|
|||
document.body.style['WebkitTransform'] !== undefined ||
|
||||
document.body.style['MozTransform'] !== undefined ||
|
||||
document.body.style['msTransform'] !== undefined ||
|
||||
document.body.style['OTransform'] !== undefined;
|
||||
document.body.style['OTransform'] !== undefined,
|
||||
|
||||
// Throttles mouse wheel navigation
|
||||
mouseWheelTimeout = 0;
|
||||
|
||||
/**
|
||||
* Starts up the slideshow by applying configuration
|
||||
|
@ -129,15 +133,15 @@ var Reveal = (function(){
|
|||
dom.wrapper.classList.add( config.theme );
|
||||
}
|
||||
|
||||
if( config.mouseWheel ) {
|
||||
document.addEventListener('DOMMouseScroll', onDocumentMouseScroll, false); // FF
|
||||
document.addEventListener('mousewheel', onDocumentMouseScroll, false);
|
||||
}
|
||||
|
||||
if( config.rollingLinks ) {
|
||||
// Add some 3D magic to our anchors
|
||||
linkify();
|
||||
}
|
||||
|
||||
//bind scrolling
|
||||
if(window.addEventListener){
|
||||
document.addEventListener('DOMMouseScroll', scrollStep, false);
|
||||
}
|
||||
|
||||
// Read the initial hash
|
||||
readURL();
|
||||
|
@ -251,6 +255,24 @@ var Reveal = (function(){
|
|||
slide();
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Handles mouse wheel scrolling, throttled to avoid
|
||||
* skipping multiple slides.
|
||||
*/
|
||||
function onDocumentMouseScroll( event ){
|
||||
clearTimeout( mouseWheelTimeout );
|
||||
|
||||
mouseWheelTimeout = setTimeout( function() {
|
||||
var delta = event.detail || -event.wheelDelta;
|
||||
if( delta > 0 ) {
|
||||
availableRoutes().down ? navigateDown() : navigateRight();
|
||||
}
|
||||
else {
|
||||
availableRoutes().up ? navigateUp() : navigateLeft();
|
||||
}
|
||||
}, 100 );
|
||||
}
|
||||
|
||||
/**
|
||||
* Handler for the window level 'hashchange' event.
|
||||
|
@ -627,26 +649,6 @@ var Reveal = (function(){
|
|||
}
|
||||
}
|
||||
|
||||
var stepT=0;
|
||||
function scrollStep(e){
|
||||
clearTimeout(stepT);
|
||||
stepT=setTimeout(function(){
|
||||
if(e.detail>0){
|
||||
if(availableRoutes().down){
|
||||
navigateDown()
|
||||
}else{
|
||||
navigateRight()
|
||||
}
|
||||
}else{
|
||||
if(availableRoutes().up){
|
||||
navigateUp()
|
||||
}else{
|
||||
navigateLeft()
|
||||
}
|
||||
}
|
||||
},200);
|
||||
}
|
||||
|
||||
// Expose some methods publicly
|
||||
return {
|
||||
initialize: initialize,
|
||||
|
|
Loading…
Reference in a new issue