Question

我正在使用SliceJack FullPage.js fade effect code snippet（第一个）在我的网站上获得过渡效果，效果很好，我对它们在桌面上很满意（把它们放到我的主要CSS中）。

我想在较小的设备（如Ipad和移动设备）上禁用效果，因此我可以滚动默认（正常）而不转换。

我禁用效果的唯一选择是删除代码段（第一个），但我在桌面上丢失了这些效果。

我在jQuery.fullPage.js脚本中启用了976像素的响应宽度。

是否可以在移动设备和iPad上清空我在CSS中添加的3个类（用于转换）？

＆＃13;

/*Fade in effect & one pager*/
.fullpage-wrapper {
	width: 100%!important;
	transform: none!important;
}

.fp-section {
	width: 100%!important;
	position: absolute;
	left: 0;
	top: 0;
	visibility: hidden;
	opacity: 0;
	z-index: 0;
	transition: all .7s ease-in-out;
}

.fp-section.active {
	visibility: visible;
	opacity: 1;
	z-index: 1;
}
/* Remove transition when website is still loading */
body {display:none}
body[class*="fp-viewing-"] {display:block}

＆＃13;

Answer 1

如果您正在使用fullPage.js和fadingEffect extension，那么您可以使用fullPage.js回调和函数以正确的方式解决此问题：

$('#fullpage').fullPage({
    responsiveWidth: 976,
    afterResponsive: function(isResponsive){
        if(isResponsive){
            $.fn.fullpage.fadingEffect.turnOff();
        }
        else{
            $.fn.fullpage.fadingEffect.turnOn();
        }
    }
});

FullPage.js淡化对桌面的影响，禁用并在较小的设备上进行默认滚动

1 个答案: