javascript - 如何在同一个 Contao 页面上获取 jQuery 和 Mootools？

Question

我正在开发一个 Contao 站点，该站点应该从 2.11.6 升级到 3.5.40，因为提供商很快就会强制 PHP 从 5.6 升级到 7.3。升级后的网站在外观和感觉上应该与旧网站类似。

我已经完成了 Contao 升级，除了使用两个扩展的主页之外，所有页面看起来都很好:

• MenuMatic 0.68.3 for the main navigation (all pages use this)
• FlexSlider 1.4.3 directly underneath the menu (only on the home page)

MenuMatic 使用 Mootools，FlexSlider 使用 jQuery。这两个扩展似乎不能一起工作。如果我只启用 Mootools，菜单就会工作(将鼠标悬停在顶部元素之一上会下拉子菜单)；如果我使用 jQuery 添加 FlexSlider 内容元素， slider 可以工作，但菜单下拉列表不行。我还没有找到在 contao 3.5 上与 Mootools 一起运行的带有淡入淡出选项的 slider 。

MenuMatic 在页面上注入(inject)这些脚本:

<!-- Load the MenuMatic Class -->
<script src="js/MenuMatic_0.68.3.js" type="text/javascript" charset="utf-8"></script>

<!-- Create a MenuMatic Instance -->
<script type="text/javascript" >
    window.addEvent('domready', function() {
    var myMenu = new MenuMatic();
    });
</script>

这是我尝试过的:

• use a pure CSS menu: works on a simple html page, not on the Contao home page – no dropdown
• insert jQuery.noConflict() in the FlexSlider inline script
• wrap flexslider.js with jQuery(document).ready(function( $ ) { ... });

FlexSlider 内联脚本，无冲突:

<script type="text/javascript">
    /* <![CDATA[ */
    jQuery.noConflict();
    (function($) {
    $(window).load(function() {
        $("#schule").flexslider({
        slideshowSpeed: 6000,
        animationSpeed: 3000,
            animation: "fade",
        direction: "horizontal",
                    controlNav: false,
                    directionNav: false,
            randomize: false,
            pauseOnHover: false,
                pauseOnAction: true,
        useCSS: false,
            touch: true
        });
    });
    })(jQuery);
    /* ]]> */
</script>

你能帮忙吗？

请参阅下面我的回答。

Answer 1

将您的 MenuMatic 脚本替换为 https://gist.github.com/DimitarChristoff/7354353例如。