jScrollabilityは複雑なスクロールベースのアニメーションを持つ、スクロールページを構築することができるjQueryプラグイン。

HTML

<section class="section section-1">
    <h3 class="slide-in-demo">Slide elements in</h3>
</section>

CSS

.section-1 .slide-in-demo {
    position: absolute;
    top: 15%;
    width: 100%;
    left: 0;
    text-align: center;
    font-size: 4em;
}

JS

(function($) {
    $(document).ready(function() {
        $.jScrollability([
            {
                'selector': '.slide-in-demo',
                'start': 'parent',
                'end': 'parent',
                'fn': {
                    'left': {
                        'start': 100,
                        'end': 0,
                        'unit': '%'
                    }
                }
            }
        ]);
    });
})(jQuery);

MIT

• Tag
• Animations
• jQuery