我正在尝试使用两个(如果考虑到第二个使用 2 个文件,则三个)不同的插件,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>
如果有人能帮我解决这个问题,我真的很感激..