0

我正在尝试使用两个(如果考虑到第二个使用 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>

如果有人能帮我解决这个问题,我真的很感激..

4

1 回答 1

1

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

如果您不想在页面加载时打开菜单,只需删除jPM.trigger(...);调用即可。

于 2013-04-13T06:55:35.203 回答