Last active
June 7, 2017 20:08
-
-
Save aleger/d35fe17d8262a3f8660f8fa9ad56f4d6 to your computer and use it in GitHub Desktop.
Custom horizontal scrolling (jQuery)
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| //Horizontal Scrolling for the Org Chart | |
| function horzontalScrolling() { | |
| $(".scroll-btn-left").hide(); | |
| if ($.browser.chrome) { | |
| var orgChartTarget = "body" | |
| } else { | |
| var orgChartTarget = "html" | |
| } | |
| $("#orgChartToggleDiv").find(".scroll-btn-left").on({ | |
| 'mousedown touchstart': function () { | |
| $("iframe").contents().find(orgChartTarget).animate({ scrollLeft: 0 }, 2000); | |
| }, | |
| 'mouseup touchend': function () { | |
| $("iframe").contents().find(orgChartTarget).stop(true); | |
| } | |
| }); | |
| $("#orgChartToggleDiv").find(".scroll-btn-right").on({ | |
| 'mousedown touchstart': function () { | |
| $("iframe").contents().find(orgChartTarget).animate({ scrollLeft: $("iframe").contents().find(orgChartTarget)[0].scrollWidth }, 2000); | |
| }, | |
| 'mouseup touchend': function () { | |
| $("iframe").contents().find(orgChartTarget).stop(true); | |
| } | |
| }); | |
| // Hide scroll buttons on end of horizontal scrollbar - Andrew | |
| $("iframe").contents().scroll(function () { | |
| //console.log($("iframe").contents().find(orgChartTarget).scrollLeft()); | |
| //console.log($("iframe").contents().find(orgChartTarget).outerWidth()); | |
| //console.log($("iframe").contents().find(orgChartTarget).get(0).scrollWidth); | |
| var newScrollLeft = $("iframe").contents().find(orgChartTarget).scrollLeft(); | |
| var width = $("iframe").contents().find(orgChartTarget).outerWidth(); | |
| var scrollWidth = $("iframe").contents().find(orgChartTarget).get(0).scrollWidth; | |
| if (scrollWidth - newScrollLeft == width) { | |
| $(".scroll-btn-right").hide(); | |
| element.trigger('mouseup touchend'); | |
| } else { | |
| $(".scroll-btn-right").show(); | |
| } | |
| if (newScrollLeft === 0) { | |
| $(".scroll-btn-left").hide(); | |
| element.trigger('mouseup touchend'); | |
| } else { | |
| $(".scroll-btn-left").show(); | |
| } | |
| }); | |
| } | |
| function hasHorizontalScrollBar() { | |
| var orgChartIframe = document.getElementById("orgChartWindow"); //need real DOM Node, not jQuery wrapper | |
| var hasHorizontalScrollbar = $("iframe").contents().width() > orgChartIframe.clientWidth; //scrollWidth does not work for iframe | |
| if (hasHorizontalScrollbar) { | |
| $(".org-chart-scroll-btn").show(); | |
| } else { | |
| $(".org-chart-scroll-btn").hide(); | |
| } | |
| } |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment