**先討論一下思路:這三個區塊會滑出來，可能是游標指到某一個元素時觸發函式，
這通常會使用javascript。
因此你可以看他自己寫的 https://www.epadesign.tw/__system/__js/h_abe9b35c322da2001b506ae8e969b269/2285042_combined.min.js 這一隻js,
我挑出幾個關鍵的function如下，您可以研究看看，謝謝。

1.主要使用的函式是 ivfx_fade_in :**

(jQuery), function (i) {
        i.fn.ivfx_fade_in = function (t) {
            return this.each(function () {
                new jQuery.ivfx_fade_in(this, t)
            })
        }, i.fn.ivfx_fade_in_activate = function () {
            return this.each(function () {
                jQuery.data(this, "ivfx_fade_in").activate()
            })
        }, i.fn.ivfx_fade_in_deactivate = function () {
            return this.each(function () {
                jQuery.data(this, "ivfx_fade_in").deactivate()
            })
        }, i.fn.ivfx_fade_in_editor_activate = function () {
            return this.each(function () {
                jQuery.data(this, "ivfx_fade_in").editor_activate()
            })
        }, i.fn.ivfx_fade_in_editor_deactivate = function () {
            return this.each(function () {
                jQuery.data(this, "ivfx_fade_in").editor_deactivate()
            })
        }, i.ivfx_fade_in = function (t, e) {
            i.data(t, "ivfx_fade_in", this), e = i.extend({
                id: t.id,
                $ele: i(t),
                name: "ivfx_fade_in",
                events: {
                    top: ["scroll", "orientationchange"],
                    bottom: ["scroll", "orientationchange"]
                },
                inline_styles: {
                    transform: !0,
                    "transform-style": !0,
                    position: !0,
                    opacity: !0
                },
                styles_on_activate: {
                    top: {
                        opacity: 0
                    },
                    bottom: {
                        opacity: 0
                    }
                }
            }, e), this.options = e, i.ivfx.register_effect(this), i.ivfx_tweenmax.register_effect(this);
            var l = this,
                c = l.$ele;
            return this.set_parameters = function () {
                l._params.direction = "none", l._params.trigger_event = "top", l._params.duration = 1, l._params.delay = 0, l._params.bring_to_front = "1", l._params.will_reset_at_top = !1, l._params.easing = "Linear.easeNone";
                var t = l.refresh_selected_breakpoint(),
                    e = !!t && t.params;
                e && (-1 !== i.inArray(e.__direction, ["none", "left", "right", "up", "down"]) && (l._params.direction = e.__direction), 0 == e.__bring_to_front && (l._params.bring_to_front = "0"), 1 == e.__will_reset_at_top && (l._params.will_reset_at_top = !0), e.__easing && (l._params.easing = e.__easing), l.is_number(e.__duration) && (l._params.duration = e.__duration), l.is_number(e.__delay) && (l._params.delay = e.__delay), e.__trigger_event && (l._params.trigger_event = e.__trigger_event))
            }, this.create_tween = function (t) {
                if (t = t || {}, l.is_tween_playing) return !1;
                var e = t.duration || l._params.duration,
                    i = {
                        startAt: {
                            opacity: 0
                        },
                        delay: t.delay || l._params.delay,
                        opacity: 1,
                        ease: l._params.easing,
                        onStart: function () {
                            l.is_tween_playing = !0, 1 == l._params.bring_to_front && l.bring_to_front()
                        }, onComplete: function () {
                            l.is_tween_playing = !1
                        }
                    },
                    n = (c.css("position"), l.first_relative_parent(c)),
                    r = l.element_bounding_rect(n),
                    a = l.element_bounding_rect(c),
                    s = a.left - r.left,
                    o = a.top - r.top;
                switch (l._params.direction) {
                case "left":
                    "none" == c.css("transform") ? (i.startAt.x = "50%", i.x = "0%") : (i.startAt.marginLeft = 0, i.startAt.marginRight = 0, i.startAt.x = 0, i.startAt.left = s + 200, i.left = s);
                    break;
                case "right":
                    "none" == c.css("transform") ? (i.startAt.x = "-50%", i.x = "0%") : (i.startAt.marginLeft = 0, i.startAt.marginRight = 0, i.startAt.x = 0, i.startAt.left = s - 200, i.left = s);
                    break;
                case "up":
                    "none" == c.css("transform") ? (i.startAt.y = "50%", i.y = "0%") : (i.startAt.marginTop = 0, i.startAt.marginBottom = 0, i.startAt.y = 0, i.startAt.top = o + 200, i.top = o);
                    break;
                case "down":
                    "none" == c.css("transform") ? (i.startAt.y = "-50%", i.y = "0%") : (i.startAt.marginTop = 0, i.startAt.marginBottom = 0, i.startAt.y = 0, i.startAt.top = o - 200, i.top = o)
                }
                l.tween = new TweenMax(c[0], e, i)
            }, l.auto_init({
                no_wait: !0
            }), this
        }
    }

2.三個區塊ID如下:
rot_ctr1_bod_ctr2_bod_wrp1_blk3_custom_blk1_custom_blk1_custom
rot_ctr1_bod_ctr2_bod_wrp1_blk3_custom_blk1_custom_blk2_custom
rot_ctr1_bod_ctr2_bod_wrp1_blk3_custom_blk1_custom_blk3_custom

jQuery("#rot_ctr1_bod_ctr2_bod_wrp1_blk3_custom_blk1_custom_blk1_custom").ivfx_fade_in({
        class: "ivfx_fade_in",
        breakpoint_params: {
            770: {
                name: "phablet",
                params: {
                    __easing: "Back.easeOut",
                    __bring_to_front: "0",
                    __direction: "down"
                },
                width: "770",
                is_enabled: 1
            },
            499: {
                width: "499",
                name: "phone",
                params: {
                    __easing: "Back.easeOut",
                    __direction: "down",
                    __bring_to_front: "0"
                },
                is_enabled: 1
            },
            1e3: {
                is_enabled: 1,
                width: "1000",
                params: {
                    __bring_to_front: "0",
                    __direction: "down",
                    __easing: "Back.easeOut"
                },
                name: "tablet"
            },
            0: {
                width: "0",
                name: "desktop",
                params: {
                    __easing: "Back.easeOut",
                    __direction: "down",
                    __bring_to_front: "0"
                },
                is_enabled: 1
            }
        },
        breakpoints: [0, 1e3, 770, 499]
    }), jQuery("#rot_ctr1_bod_ctr2_bod_wrp1_blk3_custom_blk1_custom_blk2_custom").ivfx_fade_in({
        breakpoints: [0, 1e3, 770, 499],
        breakpoint_params: {
            1e3: {
                is_enabled: 1,
                name: "tablet",
                params: {
                    __easing: "Back.easeOut",
                    __delay: "0.3",
                    __bring_to_front: "0",
                    __direction: "down"
                },
                width: "1000"
            },
            0: {
                is_enabled: 1,
                width: "0",
                params: {
                    __easing: "Back.easeOut",
                    __delay: "0.3",
                    __bring_to_front: "0",
                    __direction: "down"
                },
                name: "desktop"
            },
            770: {
                is_enabled: 1,
                width: "770",
                name: "phablet",
                params: {
                    __easing: "Back.easeOut",
                    __delay: "0.3",
                    __bring_to_front: "0",
                    __direction: "down"
                }
            },
            499: {
                is_enabled: 1,
                width: "499",
                params: {
                    __delay: "0.3",
                    __easing: "Back.easeOut",
                    __direction: "down",
                    __bring_to_front: "0"
                },
                name: "phone"
            }
        },
        class: "ivfx_fade_in"
    }), jQuery("#rot_ctr1_bod_ctr2_bod_wrp1_blk3_custom_blk1_custom_blk3_custom").ivfx_fade_in({
        breakpoints: [0, 1e3, 770, 499],
        class: "ivfx_fade_in",
        breakpoint_params: {
            1e3: {
                is_enabled: 1,
                params: {
                    __delay: "0.6",
                    __easing: "Back.easeOut",
                    __direction: "down",
                    __bring_to_front: "0"
                },
                name: "tablet",
                width: "1000"
            },
            0: {
                is_enabled: 1,
                params: {
                    __direction: "down",
                    __bring_to_front: "0",
                    __delay: "0.6",
                    __easing: "Back.easeOut"
                },
                name: "desktop",
                width: "0"
            },
            499: {
                width: "499",
                params: {
                    __bring_to_front: "0",
                    __direction: "down",
                    __easing: "Back.easeOut",
                    __delay: "0.6"
                },
                name: "phone",
                is_enabled: 1
            },
            770: {
                width: "770",
                params: {
                    __bring_to_front: "0",
                    __direction: "down",
                    __easing: "Back.easeOut",
                    __delay: "0.6"
                },
                name: "phablet",
                is_enabled: 1
            }
        }
    });

這是用lazyload + animate.css做出來的。
Attempt at Lazyload animate.css