javascript - 使用 jquery.fullPage 向下滚动时如何更改 WCircleMenu 选项

标签 javascript jquery css fullpage.js anythingslider

我有这个代码:http://jsfiddle.net/hevercking/t0qxavfc/

当您单击“&”按钮时,使用 WCircleMenu 效果在按钮顶部显示社交网络链接,当有人使用 jquery.fullPage 效果向下滚动栏菜单时出现,因为这里一切正常,但是现在我想更改 angle_start 180º 以在 oter 页面中显示菜单,因为如果我按下 otter 页面中的按钮,社交按钮会出现在另一侧,我尝试进行一些更改但一切都停止工作,有人可以帮助我做这个?

这是我的js代码

$(document).ready(function() {
//FULL PAGE CODE
$('#fullpage').fullpage({
    verticalCentered: false,

    onLeave: function(index, nextIndex, direction){
        //leaving 1st section
        if(index == 1){
            $('.barra').addClass('fixed');
        }
        //back to the 1st section
        if(nextIndex == 1){
            $('.barra').removeClass('fixed');
            pag = 'nextIndex';
        }
    },

    afterResize: function(){
        windowsHeight = $(window).height();
    }
});
//END FULL PAGE CODE

//WCircleMenu config
$(document).ready(function(){
    $('#my-menu').WCircleMenu({
        angle_start : -Math.PI/1.371,
        delay: 50,
        distance: 100,
        angle_interval: Math.PI/6.5,
        easingFuncShow:"easeOutBack",
        easingFuncHide:"easeInBack",
        step:15,
        openCallback:true,
        closeCallback:true,
        itemRotation:360,
        iconRotation:180,
    });
});
//End WCircleMenu config});

最佳答案

您可以在整页函数中更改参数

$(document).ready(function() {
            $('#fullpage').fullpage({
                verticalCentered: false,

                onLeave: function(index, nextIndex, direction){
                    //leaving 1st section
                    if(index == 1){
                       $('.barra').addClass('fixed');
                        $('#my-menu').WCircleMenu({angle_start : Math.PI/4.371});
                    }
                    //back to the 1st section
                    if(nextIndex == 1){
                        $('.barra').removeClass('fixed');
                        pag = 'nextIndex';
                        $('#my-menu').WCircleMenu({angle_start : -Math.PI/1.371});
                    }
                },

                afterResize: function(){
                    windowsHeight = $(window).height();
                }

                //to avoid problems with css3 transforms and fixed elements in Chrome, as detailed here: https://github.com/alvarotrigo/fullPage.js/issues/208
                //css3:false
            });


        });

关于javascript - 使用 jquery.fullPage 向下滚动时如何更改 WCircleMenu 选项,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/32272521/

相关文章:

javascript - 我怎样才能用d3把一个圆圈放在前面?

javascript - Observable Race Condition,如何正确计时两个 Observables

javascript - jQuery 幻灯片放映更新 url 与哈希值

javascript - JQuery Each 不等待内部函数完成

css - 使用 flex 居中 div

具有 4 个对象的 CSS3 旋转动画

javascript - 我如何等待 Cordova 和 jQuery 加载它们的库?

javascript - 使用 Angular JS 更改单击时按钮的文本

html - 样式表边框仅在 Bootstrap 中的表列上?

javascript - 将数据从 Laravel Controller 传递到 Js