https://papabu.co.kr/assets/js/components/hs.go-to.js

1/**
2 * Go To wrapper.
3 *
4 * @author Htmlstream
5 * @version 1.0
6 *
7 */
8;(function ($) {
9  'use strict';
10  $.HSCore.components.HSGoTo = {
11    /**
12     *
13     *
14     * @var Object _baseConfig
15     */
16    _baseConfig: {},
17
18    /**
19     *
20     *
21     * @var jQuery pageCollection
22     */
23    pageCollection: $(),
24
25    /**
26     * Initialization of Go To wrapper.
27     *
28     * @param String selector (optional)
29     * @param Object config (optional)
30     *
31     * @return jQuery pageCollection - collection of initialized items.
32     */
33
34    init: function (selector, config) {
35      this.collection = selector && $(selector).length ? $(selector) : $();
36      if (!$(selector).length) return;
37
38      this.config = config && $.isPlainObject(config) ?
39        $.extend({}, this._baseConfig, config) : this._baseConfig;
40
41      this.config.itemSelector = selector;
42
43      this.initGoTo();
44
45      return this.pageCollection;
46    },
47
48    initGoTo: function () {
49      //Variables
50      var $self = this,
51        collection = $self.pageCollection;
52
53      //Actions
54      this.collection.each(function (i, el) {
55        //Variables
56        var $this = $(el),
57          $target = $this.data('target'),
58          type = $this.data('type'),
59          showEffect = $this.data('show-effect'),
60          position = JSON.parse(el.getAttribute('data-position')),
61          compensation = $($this.data('compensation')).outerHeight(),
62          offsetTop = $this.data('offset-top');
63
64        $this.addClass('animated').css({
65          'display': 'inline-block',
66          'position': type,
67          'opacity': 0
68        });
69
70        if (type == 'fixed' || type == 'absolute') {
71          $this.css(position);
72        }
73
74        $this.on('click', function (e) {
75          e.preventDefault();
76
77          $('html, body').stop().animate({
78            'scrollTop': $target ? $($target).offset().top - compensation : 0
79          }, 800);
80        });
81
82        if (!$this.data('offset-top') && !$this.hasClass('u-animation-was-fired')) {
83          if ($this.offset().top <= $(window).height()) {
84            $this.addClass('u-animation-was-fired ' + showEffect).css({
85              'opacity': ''
86            });
87          }
88        }
89
90        $(window).on('scroll', function () {
91          if ($this.data('offset-top')) {
92            if ($(window).scrollTop() >= offsetTop && !$this.hasClass('u-animation-was-fired')) {
93              $this.addClass('u-animation-was-fired ' + showEffect).css({
94                'opacity': ''
95              });
96            } else if ($(window).scrollTop() <= offsetTop && $this.hasClass('u-animation-was-fired')) {
97              $this.removeClass('u-animation-was-fired ' + showEffect).css({
98                'opacity': 0
99              });
100            }
101          } else {
102            var thisOffsetTop = $this.offset().top;
103
104            if (!$this.hasClass('u-animation-was-fired')) {
105              if ($(window).scrollTop() >= thisOffsetTop - $(window).height()) {
106                $this.addClass('u-animation-was-fired ' + showEffect).css({
107                  'opacity': ''
108                });
109              }
110            }
111          }
112        });
113
114        $(window).trigger('scroll');
115
116        //Actions
117        collection = collection.add($this);
118      });
119    }
120  };
121})(jQuery);