scroll-to-top.js 2.8 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394
  1. app.directive('scrollTop', [function() {
  2. let link = function(scope, element, attrs) {
  3. window.top = {};
  4. var sc = window.top;
  5. sc.time = 12; // время прокручивания
  6. sc.goTop = function (time, acceleration) {
  7. acceleration = acceleration || 0.1;
  8. time = time || sc.time;
  9. var dx = 0;
  10. var dy = 0;
  11. var bx = 0;
  12. var by = 0;
  13. var wx = 0;
  14. var wy = 0;
  15. if (document.documentElement) {
  16. dx = document.documentElement.scrollLeft || 0;
  17. dy = document.documentElement.scrollTop || 0;
  18. }
  19. if (document.body) {
  20. bx = document.body.scrollLeft || 0;
  21. by = document.body.scrollTop || 0;
  22. }
  23. var wx = window.scrollX || 0;
  24. var wy = window.scrollY || 0;
  25. var x = Math.max(wx, Math.max(bx, dx));
  26. var y = Math.max(wy, Math.max(by, dy));
  27. var speed = 1 + acceleration;
  28. window.scrollTo(Math.floor(x / speed), Math.floor(y / speed));
  29. if(x > 0 || y > 0) {
  30. var invokeFunction = "window.top.goTop("+ time +")"
  31. window.setTimeout(invokeFunction, time);
  32. }
  33. return false;
  34. }
  35. sc.showHide = function (){
  36. var a = document.getElementById('gotop');
  37. a.onclick = function(e){ e.preventDefault(); window.top.goTop(); }
  38. var stop = (document.body.scrollTop || document.documentElement.scrollTop);
  39. if( stop > 200 ){
  40. a.style.display = 'block';
  41. sc.smoothopaque(a, 'show', 30, false);
  42. } else {
  43. sc.smoothopaque(a, 'hide', 30, function(){a.style.display = 'none';});
  44. }
  45. return false;
  46. }
  47. // Плавная смена прозрачности
  48. sc.smoothopaque = function (el, todo, speed, endFunc){
  49. var
  50. startop = Math.round( el.style.opacity * 100 ),
  51. op = startop,
  52. endop = (todo == 'show') ? 100 : 0;
  53. clearTimeout( window['top'].timeout );
  54. window['top'].timeout = setTimeout(slowopacity, 20);
  55. function slowopacity(){
  56. if( startop < endop ){
  57. op += 5;
  58. if( op < endop )
  59. window['top'].timeout = setTimeout(slowopacity, speed);
  60. else
  61. (endFunc) && endFunc();
  62. }
  63. else {
  64. op -= 5;
  65. if( op > endop ){
  66. window['top'].timeout = setTimeout(slowopacity, speed);
  67. }
  68. else
  69. (endFunc) && endFunc();
  70. }
  71. // установка opacity
  72. el.style.opacity = (op/100);
  73. el.style.filter = 'alpha(opacity=' + op + ')';
  74. }
  75. }
  76. if (window.addEventListener){
  77. window.addEventListener("scroll", sc.showHide, false);
  78. window.addEventListener("load", sc.showHide, false);
  79. }
  80. else if (window.attachEvent){
  81. window.attachEvent("onscroll", sc.showHide);
  82. window.attachEvent("onload", sc.showHide);
  83. }
  84. }
  85. return {
  86. restrict: 'E',
  87. templateUrl: './app/views/scrollToTop.html',
  88. link: link
  89. }
  90. }]);