FSVS-jQuery和CSS3带过渡效果的全屏整页垂直滚动特效插件

适用浏览器：360、FireFox、Chrome、Safari、Opera、傲游、搜狗、世界之窗. 不支持IE8及以下浏览器。


$(document).ready( function() {
    // The HTML tag must have a class of fsvs
    var fsvs = $.fn.fsvs({
        speed : 1000
    });
});

Basic HTML setup


<!doctype html>
<html class="fsvs" lang="en">
    <body>
        <div id="fsvs-body">
            <div class="slide"></div>
            <div class="slide"></div>
            <div class="slide"></div>
        </div>
    </body>
</html>

Default Options


$(document).ready( function() {
    var fsvs = $.fn.fsvs({
        speed : 5000,
        bodyID : 'fsvs-body',
        selector : '> .slide',
        mouseSwipeDisance : 40,
        afterSlide : function(){},
        beforeSlide : function(){},
        endSlide : function(){},
        mouseWheelEvents : true,
        mouseDragEvents : true,
        touchEvents : true,
        arrowKeyEvents : true,
        pagination : true,
        nthClasses : false,
        detectHash : true
    });
});

Load In New Slides On End


$(document).ready( function() {
    var slider = $.fn.fsvs({
        ...
        endSlide : function(index) {
            $('<div class="slide"><h2>Slide ' + (index+2) + '</h2></div>').appendTo( $('body') );
            // reset the nth classes if you need it
            slider.nthClasses(3);
            // rebind pagination if you need it
            slider.addPagination();
        }
        ...
    });
});

X关闭

jQuery+CSS3实现的全屏垂直翻页特效源码

jQuery+CSS3全屏垂直翻页代码是一款带过渡效果的全屏垂直翻页特效插件，该全屏翻页插件在页面上下滚动时一次翻一屏，并带有CSS3过渡动画效果。本段代码适应于所有网页使用，有兴趣的朋友们可以前来下载使用。本段代码兼容目前最新的各类主流浏览器，是一款非常优秀的特效源码。