-1

jQueryに基づくナビゲーションメニューを持つWebサイトでjQuery v1.8.3を使用するWowsliderから写真スライダーを追加しようとしていますが、正確なバージョンはわかりません（ソースファイルを取得したチュートリアルはこちらです）

2 つの jquery.js ファイルの 1 つをコメント アウトすると、もう 1 つのファイルは正常に機能します。しかし、Wowoslider のスライダーとアニメーション メニューを正しく連携させることができません。

私のHTMLのコードはこれらです。問題は js/jquery.js (不明なバージョン) および engine1/jquery.js (1.8.3 バージョン) に付属しています

<script type="text/javascript" src="js/jquery.js"></script>
    <script type="text/javascript" src="js/jquery-bp.js"></script>
    <script type="text/javascript" src="js/navigation.js"></script>
    <script type="text/javascript" src="date_time.js"></script>
    <!-- Start WOWSlider.com HEAD section -->
    <link rel="stylesheet" type="text/css" href="engine1/style.css" />
    <script type="text/javascript" src="engine1/jquery.js"></script>
    <!-- End WOWSlider.com HEAD section -->
</head>

同じページで複数のバージョンの jQuery を使用できますか?

解決策は簡単に思えますが、私はこれを理解できません

次に、 の代わりに、または$('#selector').function();を実行します。jQuery_1_3_2('#selector').function();jQuery_1_1_3('#selector').function();

次のように、html に含めるスクリプト コードを変更します。

<!-- load jQuery 1.2.3 -->
    <script type="text/javascript" src="js/jquery.js"></script>
    <script type="text/javascript">
    var jQuery_1_2_3 = $.noConflict(true);
    </script>
            <!-- ...other code... -->
    <!-- load jQuery 1.8.3 -->
    <script type="text/javascript" src="engine1/jquery.js"></script>
    <script type="text/javascript">
    var jQuery_1_8_2 = $.noConflict(true);
    </script>

次に、jQuery 1.2.3 を使用する 2 .js ファイルのコードを変更しようとするので、すべての$文字をこれに置き換えますjQuery_1_2_3

並べ替えの例のデフォルトは

(function($) { $.extend($.fx.step,{ backgroundPosition: function(fx) { if (fx.state === 0 && typeof fx.end == 'string') { var start = $. curCSS(fx.elem,'backgroundPosition');

そして、私はこれに変更します：

(function(jQuery_1_2_3) { jQuery_1_2_3.extend(jQuery_1_2_3.fx.step,{ backgroundPosition: function(fx) { if (fx.state === 0 && typeof fx.end == 'string') { var start = jQuery_1_2_3.curCSS(fx.elem,'backgroundPosition');

私は何か間違っていることを理解していると思います..スチールは機能しません..

4

1 に答える 1

0

ここで、自分でテストしたソリューションを思いつきました。メニューチュートリアルを確認してソースコードをダウンロードし、同じページでWow Sliderを使用しますが、私の方法は次のとおりです。

// Top of Head に以下のコードを追加

<!-- Navigation Menu-->
<link rel="stylesheet" href="css/main.css" type="text/css" />   
<script type="text/javascript" src="js/jquery.js" ></script>
<script type="text/javascript" src="js/jquery-bp.js" ></script>
<script type="text/javascript" src="js/navigation.js" ></script>
<!-- End Navigation -->

// ページの下部に Wow Slider スクリプトを追加します

<!-- Start WOWSlider.com HEAD section -->
<link rel="stylesheet" type="text/css" href="engine1/style.css" />
<script type="text/javascript" src="engine1/jquery.js"></script>
<!-- End WOWSlider.com HEAD section -->

<script type="text/javascript" src="engine1/wowslider.js"></script>
<script type="text/javascript" src="engine1/script.js"></script>
<!-- End WOWSlider.com BODY section -->

ここで、「navigation.js」にいくつかの変更を加えます

1) すべての関数を中に書く

(function($) {
  $(function() {
  // all navigation function put here

  });
})(jQuery);
// other code using $ as an alias to the other library

それ以外の

$(document).ready(function(){

});

このリンクにコードをアップロードしました。ダウンロードして、それがあなたのために働いているかどうか教えてください..私にとっては、ChromeとFirefoxで働いています。

于 2013-02-07T08:43:44.420 に答える