<link href="https://cdnjs.cloudflare.com/ajax/libs/fullPage.js/2.6.6/jquery.fullPage.css" rel="stylesheet"> <script src="https://cdnjs.cloudflare.com/ajax/libs/fullPage.js/2.6.6/jquery.fullPage.min.js"></script> <script>
let lastSlide = false;
$( document ).ready(function() {
//Записываем ID нужных вертикальных блоков в массив данных
var blockidvert = [
".uc-full-slide-1" ,
".uc-full-slide-2" ,
".uc-full-slide-3" ,
".uc-full-slide-4" ,
".uc-full-slide-5" ,
".uc-full-slide-6" ,
".uc-full-slide-7" ,
".uc-full-slide-8" ,
".uc-full-slide-9"
];
function completewrap(){
//Добавляем классы к нужным блокам
for(let i = 0; i < blockidvert.length; i++){
$(blockidvert[i]).addClass('singlelememt');
};
//Оборачиваем эти блоки в секции
$('.singlelememt').wrap('<section class="vertical-scrolling"></section>');
//Все блоки оборачиваем в общий контейнер
$('.vertical-scrolling').wrapAll('<div id="fullPage"></div>');
//Настройки эффекта
$('#fullPage').fullpage({
sectionSelector: '.vertical-scrolling',
anchors: ['main', 'hello', 'slidefull', 'service', 'obslugivanie', 'proizvodstvo', 'sotrudnichestvo', 'opyt', 'project'],
navigationTooltips: ['Главная', 'Направления', 'Решения', 'Оборудование', 'Обслуживание', 'Производство', 'Сотрудничество', 'Опыт работы', 'Реализованные проекты'],
css3: true,
scrollingSpeed: 1000,
navigation: true,
slidesNavigation: true,
responsiveHeight: 330,
dragAndMove: true,
scrollBar: true,
loopTop:false,
loopBottom:false,
controlArrows: true,
scrollOverflow: false,
onLeave: function(anchorLink, index, slideIndex, direction, nextSlideIndex){
if(index== $('#fullPage section').length){
$.fn.fullpage.setAllowScrolling(false);
lastSlide = true;
console.log('Последний');
}else{
$.fn.fullpage.setAllowScrolling(true);
lastSlide = false;
};
},
});
};
$(document).on('wheel', function(e){
if (e.originalEvent.wheelDelta >= 0) {
if(lastSlide) $('.uc-full-footer').removeClass('up-mode');
$.fn.fullpage.setAllowScrolling(true);
lastSlide = false;
console.log('Вверх');
} else {
if(lastSlide) $('.uc-full-footer').addClass('up-mode');
console.log('Вниз');
}
});
if ($(window).width() > 960){
completewrap();
$('body,html').css('overflow','hidden');
};
});
</script> <style>
.uc-full-footer {
transition: all 0.5s cubic-bezier(0, 0, 0.06, 1.03);
}
.uc-full-footer.up-mode {
transform: translateY(-100%);
}
</style> <style>
/*Настройки стрелок слайдера*/
#fp-nav ul li a span, .fp-slidesNav ul li a span {
border: 2px solid #fff;
background: none;
box-shadow: 0px 0px 12px 3px white;
}
/*Настройки стрелок слайдера*/
.fp-controlArrow.fp-next {
right: 50px;
border-width: 38.5px 0 38.5px 34px;
border-color: #f30f0f00 #fb303000 #ff1c1c00 #fff;
}
div#allrecords {margin-bottom: 0px;}
/*Настройки стрелок слайдера*/
.fp-controlArrow.fp-prev {
left: 50px;
width: 0;
border-width: 38.5px 34px 38.5px 0;
border-color: transparent #fff transparent transparent;
}
/*Настройки подписей навигации*/
#fp-nav ul li .fp-tooltip {
color: #ffffff;
text-shadow: 0px 0px 4px #ffffff;
}
/*Настройки подписей навигации*/
#fp-nav ul li:hover .fp-tooltip, #fp-nav.fp-show-active a.active + .fp-tooltip {
-webkit-transition: padding 0.6s ease-in;
transition: padding 0.6s ease-in;
padding-right: 10px;
}
</style>