jPanelMenu和TweenMax/superscrollorama之间的jQuery冲突

Question

我试着使用两个(如果考虑到第二个使用两个文件)不同的插件，jPanelMenu.js(做一个类似谷歌手机的菜单)和Superscrollorama.js(一起工作的TweenMax.js)，不幸的是它们是冲突的，当单独工作时都工作得很好，但是当我把它们都放到页面上时，它们都崩溃了。我已经尝试过以许多不同的方式使用$.noConflict()；和jQuery.noConflict()；，但都没有成功。我能做的最好的事情就是让scrollorama/tweenmax工作。但是，jPanelMenu仍然会崩溃。

下面是我的代码：

<script type="text/javascript" src="public/js/jquery-1.9.1.min.js"></script>
<script type="text/javascript" src="public/js/jquery.jpanelmenu.min.js"></script>
<script type="text/javascript">
     jQuery.noConflict();

         $(document).ready(function () {
            var jPM = $.jPanelMenu({
                menu: '#menu',
                trigger: '.menu-trigger',
                easing: 'ease',
                duration: 250
            });
            jPM.close(true);
            jPM.on();
            jPM.trigger(onClick);
        });

</script>
<script type="text/javascript" src="public/js/TweenMax.min.js"></script>
<script type="text/javascript" src="public/js/jquery.superscrollorama.js"></script>
<script>
    jQuery(document).ready(function($) {
        var controller = jQuery.superscrollorama({
            playoutAnimations: true
        });
        controller.triggerCheckAnim();
        controller.addTween('.scroll-trigger',

        (new TimelineLite())
                .append([
                  // Scale Logo
                    TweenMax.fromTo(jQuery('#logo'), 1, 
                    {css:{width: '100%', padding:'15px 0 0 0'}, ease:Strong.easeInOut, immediateRender:true}, 
                    {css:{width: '59%', padding:'5px 0 0 0'}, ease:Strong.easeInOut})
                ]),0,0);

      });
</script>

如果这里有人能帮我的话我会很感激的..

Answer 1

根据你给我的附加细节。您的问题不是jQuery和其他函数之间的冲突，而只是没有定义onClick函数。trigger函数根据菜单的状态打开或关闭菜单，并接受一个boolean参数，该参数指定动作是否为动画。

如果不希望在页面加载时打开菜单，只需移除jPM.trigger(...);调用。