https://www.bodhost.com/blog/wp-content/themes/new-blog/assets/js/jquery.appear.js

1
2/*
3 * jQuery.appear
4 * https://github.com/bas2k/jquery.appear/
5 * http://code.google.com/p/jquery-appear/
6 * http://bas2k.ru/
7 *
8 * Copyright (c) 2009 Michael Hixson
9 * Copyright (c) 2012-2014 Alexander Brovikov
10 * Licensed under the MIT license (http://www.opensource.org/licenses/mit-license.php)
11 */
12(function ($) {
13    $.fn.appear = function (fn, options) {
14
15        var settings = $.extend({
16
17            //arbitrary data to pass to fn
18            data: undefined,
19
20            //call fn only on the first appear?
21            one: true,
22
23            // X & Y accuracy
24            accX: 0,
25            accY: 0
26
27        }, options);
28
29        return this.each(function () {
30
31            var t = $(this);
32
33            //whether the element is currently visible
34            t.appeared = false;
35
36            if (!fn) {
37
38                //trigger the custom event
39                t.trigger('appear', settings.data);
40                return;
41            }
42
43            var w = $(window);
44
45            //fires the appear event when appropriate
46            var check = function () {
47
48                //is the element hidden?
49                if (!t.is(':visible')) {
50
51                    //it became hidden
52                    t.appeared = false;
53                    return;
54                }
55
56                //is the element inside the visible window?
57                var a = w.scrollLeft();
58                var b = w.scrollTop();
59                var o = t.offset();
60                var x = o.left;
61                var y = o.top;
62
63                var ax = settings.accX;
64                var ay = settings.accY;
65                var th = t.height();
66                var wh = w.height();
67                var tw = t.width();
68                var ww = w.width();
69
70                if (y + th + ay >= b &&
71                    y <= b + wh + ay &&
72                    x + tw + ax >= a &&
73                    x <= a + ww + ax) {
74
75                    //trigger the custom event
76                    if (!t.appeared) t.trigger('appear', settings.data);
77
78                } else {
79
80                    //it scrolled out of view
81                    t.appeared = false;
82                }
83            };
84
85            //create a modified fn with some additional logic
86            var modifiedFn = function () {
87
88                //mark the element as visible
89                t.appeared = true;
90
91                //is this supposed to happen only once?
92                if (settings.one) {
93
94                    //remove the check
95                    w.unbind('scroll', check);
96                    var i = $.inArray(check, $.fn.appear.checks);
97                    if (i >= 0) $.fn.appear.checks.splice(i, 1);
98                }
99
100                //trigger the original fn
101                fn.apply(this, arguments);
102            };
103
104            //bind the modified fn to the element
105            if (settings.one) t.one('appear', settings.data, modifiedFn);
106            else t.bind('appear', settings.data, modifiedFn);
107
108            //check whenever the window scrolls
109            w.scroll(check);
110
111            //check whenever the dom changes
112            $.fn.appear.checks.push(check);
113
114            //check now
115            (check)();
116        });
117    };
118
119    //keep a queue of appearance checks
120    $.extend($.fn.appear, {
121
122        checks: [],
123        timeout: null,
124
125        //process the queue
126        checkAll: function () {
127            var length = $.fn.appear.checks.length;
128            if (length > 0) while (length--) ($.fn.appear.checks[length])();
129        },
130
131        //check the queue asynchronously
132        run: function () {
133            if ($.fn.appear.timeout) clearTimeout($.fn.appear.timeout);
134            $.fn.appear.timeout = setTimeout($.fn.appear.checkAll, 20);
135        }
136    });
137
138    //run checks when these methods are called
139    $.each(['append', 'prepend', 'after', 'before', 'attr',
140        'removeAttr', 'addClass', 'removeClass', 'toggleClass',
141        'remove', 'css', 'show', 'hide'], function (i, n) {
142            var old = $.fn[n];
143            if (old) {
144                $.fn[n] = function () {
145                    var r = old.apply(this, arguments);
146                    $.fn.appear.run();
147                    return r;
148                }
149            }
150        });
151
152})(jQuery);