Full Page JS not Resizing Properly

Question

Ok.. so I built this page: http://stpaullux18re.wpengine.com/。现在，我将其设置为低于700像素宽。我正在努力的是，如果用户调整窗口的大小，一切都会变得很奇怪。我尝试了以下代码，但它只是破坏了页面。对我如何实现调整大小有任何想法，以便它可以优雅地调整大小？

if ($(window).width() > 700) {
$( window ).resize(function() {
$('#fullpage').fullpage({
    //Navigation

    menu: '#menu',
    lockAnchors: false,
    anchors:['Welcome', 'Distinctive', 'Neighborhood', 'Gallery'],
    navigation: true,
    navigationPosition: 'right',
    navigationTooltips: ['Welcome', 'Distinctive', 'Neighborhood', 'Gallery'],
    showActiveTooltip: false,
    slidesNavigation: true,
    slidesNavPosition: 'middle',

    //Scrolling
    css3: true,
    scrollingSpeed: 700,
    autoScrolling: true,
    fitToSection: false,
    fitToSectionDelay: 400,
    scrollBar: true,
    easing: 'easeInOutCubic',
    easingcss3: 'ease',
    loopBottom: false,
    loopTop: false,
    loopHorizontal: true,
    continuousVertical: false,
    continuousHorizontal: false,
    scrollHorizontally: false,
    interlockedSlides: false,
    dragAndMove: false,
    offsetSections: false,
    resetSliders: false,
    fadingEffect: true,
    scrollOverflow: true,
    scrollOverflowReset: false,
    scrollOverflowOptions: null,
    touchSensitivity: 15,
    normalScrollElementTouchThreshold: 5,
    bigSectionsDestination: null,

    //Accessibility
    keyboardScrolling: true,
    animateAnchor: true,
    recordHistory: true,

    //Design
    controlArrows: true,
    verticalCentered: true,
    fixedElements: '#standard, .fTab, footer',
    parallax: true,
    parallaxOptions: {type: 'cover', percentage: 62, property: 'translate'},

    //Custom selectors
    sectionSelector: '.section',
    slideSelector: '.slide',

    lazyLoading: true,

});
}

}