tweaked mouse wheel navigation

This commit is contained in:
Hakim El Hattab 2012-01-14 19:22:27 -08:00
parent 17854e892b
commit 38b229a22f
3 changed files with 36 additions and 26 deletions

View file

@ -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

View file

@ -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>

View file

@ -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,