Skip to content

Instantly share code, notes, and snippets.

@dkarzon
Last active August 29, 2015 14:06

Revisions

  1. dkarzon renamed this gist Sep 23, 2014. 1 changed file with 0 additions and 0 deletions.
    File renamed without changes.
  2. dkarzon renamed this gist Sep 22, 2014. 1 changed file with 0 additions and 0 deletions.
    File renamed without changes.
  3. dkarzon revised this gist Sep 22, 2014. 1 changed file with 6 additions and 0 deletions.
    6 changes: 6 additions & 0 deletions scrollable.css
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,6 @@
    .scrollable {
    overflow: auto;
    overflow-x: scroll;
    overflow-y: hidden;
    -ms-scroll-chaining: none;
    }
  4. dkarzon created this gist Sep 22, 2014.
    29 changes: 29 additions & 0 deletions scrollableDirective.js
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,29 @@
    angular.module('dk.directives')
    .directive('dkscrollable', function () {
    //<div dkscrollable>
    //Handles the scrolling table for the site

    function handleWheel(event) {
    event.currentTarget.scrollLeft += event.wheelDelta * -1;
    event.preventDefault();
    };


    return {
    restrict: 'A',
    multiElement: true,
    link: function (scope, element, attr) {

    var container = element[0];

    container.classList.add("scrollable");

    if ('onwheel' in container) {
    container.addEventListener('wheel', handleWheel, false);
    }
    else {
    container.addEventListener('mousewheel', handleWheel, false);
    }
    }
    };
    });