0

私はシンプルなウェブサイトを開発しています。このウェブサイトには、jQuery で動作するメニューと、jQuery で動作するイメージ スライダーもあります。これは、スクリプトと css をインポートする私のコードです。

<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js">    </script>
<link rel="stylesheet" type="text/css" href="css/jquery.slider.css" />
<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/jquery.slider.min.js"></script>

<!--[if IE 6]>
<link rel="stylesheet" type="text/css" href="js/slider/themes/carbono/jquery.slider.ie6.css" />
<![endif]-->
<script type="text/javascript">
jQuery(document).ready(function ($) {
   $(".slider").slideshow({
      width: 794,
      height: 294,
      transition: 'bar'
   });
});

$(document).ready(function () {
   $('#menu a').mouseover(function () {
      $(this).switchClass('normal', 'active', 50, 'easeOutBounce', function () {});
   });
});
$(document).ready(function () {
   $('#menu a').mouseleave(function () {
      $(this).switchClass('active', 'normal', 50, 'easeOutBounce', function () {});
   });
});
</script>

この状況では、スライダーのみが機能しています。このスクリプトは機能しません:

$(document).ready(function () {
   $('#menu a').mouseover(function () {
      $(this).switchClass('normal', 'active', 50, 'easeOutBounce', function () {});
   });
});
$(document).ready(function () {
   $('#menu a').mouseleave(function () {
      $(this).switchClass('active', 'normal', 50, 'easeOutBounce', function () {});
   });
});

何が原因で、どうすればいいですか？

4

1 に答える 1

0

私は同じ問題に遭遇しました

私のコードは次のようなものでした

...
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>
<script type="text/javascript" src="jcobb-slider/js/bjqs-1.3.min.js"></script>
<link rel="stylesheet" href="jcobb-slider/bjqs.css" />
<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.2/themes/smoothness/jquery-ui.css" />
<script type="text/javascript" src="http://code.jquery.com/ui/1.10.2/jquery-ui.js"></script>
...

同じページで jQuery 画像スライダーまたは jqueryUI のタブ付きコンテンツを使用したいと考えていました。

そして、私がしたことはここにあります：

<script type="text/javascript" language="javascript" class="secret-source">

                $.noConflict();

                jQuery(document).ready(function ($) {

                    $('#banner-fade').bjqs({
                        height: 280,
                        width: 570,
                        responsive: true
                    });

                    $("#tabs").tabs(); //jQuery UI Tabs

                });

            </script>

その後、それは今動作します。

于 2013-04-06T13:56:03.443 に答える