响应式菜单和响应式幻灯片之间的 JavaScript 冲突

Javascript conflict between responsive-menu and responsiveslides

本文关键字:响应 JavaScript 冲突 幻灯片 菜单 之间      更新时间:2023-09-26

我正在使用javascript,响应式菜单和javascript,响应式幻灯片进行响应式布局。当我在页面上一次只有一个javacript时,它们工作正常,但是响应式菜单一起不起作用。如果我将响应式菜单的 javascript 放在页面底部,菜单工作正常,但幻灯片放映不起作用。任何建议将不胜感激。

这是我的javascript呼吁:

<script src="respond.min.js"></script>
    <link rel="stylesheet" type="text/css" href="menu_files/responsive-menu.css" />
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script type="text/javascript" src="menu_files/jquery.responsive-menu.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
    $("#JQResponsiveMenu1").fdResponsiveMenu({windowMinWidth:1000,autoHighlightCurrentPage:false,subMenuOpenOnClick:false,subMenuTransitionEasing:"easeOutSine",subMenuTransitionDuration:300});
});
</script>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js" type="text/javascript">        </script>
    <link rel="stylesheet" type="text/css" href="responsiveslides.css" />

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script src="responsiveslides.min.js"></script>
<script type="text/javascript">  // You can also use "$(window).load(function() {"
jQuery(window).load(function() {
  // Slideshow 1
  jQuery("#slider1").responsiveSlides({
    maxwidth: 800,
    speed: 800
  });
  // Slideshow 2
  jQuery("#slider2").responsiveSlides({
    auto: false,
    pager: true,
    speed: 300,
    maxwidth: 540
  });
  // Slideshow 3
  jQuery("#slider3").responsiveSlides({
    manualControls: '#slider3-pager',
    maxwidth: 540
  });
  // Slideshow 4
  jQuery("#slider4").responsiveSlides({
    auto: false,
    pager: false,
    nav: true,
    speed: 500,
    namespace: "callbacks",
    before: function () {
      jQuery('.events').append("<li>before event fired.</li>");
    },
    after: function () {
      jQuery('.events').append("<li>after event fired.</li>");
    }
  });
});
</script>

不建议在一个网站上加载多个版本的jQuery。我会删除 v1.8,看看它是如何做到的。如果失败,请改为删除 1.10。1.10 中的某些更改可能会破坏您的插件。