0

< head > タグの下にある私の Web サイトの次のコードを次に示します。以下に示すように、「バナー コード」に使用される jQuery ファイルと「スティッキー ナビゲーション」に使用される jQuery の間に競合があります。

<!--Banner Code-->
    <script type='text/javascript' src='js/banner/jquery.min.js'></script><!--older version jQuery-->
    <script type='text/javascript' src='js/banner/jquery.mobile.customized.min.js'></script>
    <script type='text/javascript' src='js/banner/jquery.easing.1.3.js'></script> 
    <script type='text/javascript' src='js/banner/camera.min.js'></script> 

    <script>
      jQuery(document).ready(function() {

            jQuery('#camera_wrap_4').camera({
                height: 'auto',
                loader: 'bar',
                pagination: false,
                thumbnails: false,
                hover: false,
                opacityOnGrid: false,
                imagePath: 'images/banner'
            });

        });
    </script>
<!-- End of Banner Code-->



<!--Sticky Navigation-->
<script type="text/javascript" src="js/jquery.js"></script><!--NEWER version jQuery-->
<script type="text/javascript" src="js/jquery.sticky.js"></script>
<script>
  $(document).ready(function(){
    $("#nav").sticky({topSpacing:0});
  });
</script>
<!--Sticky Navigation close-->
4

2 に答える 2

2

まず第一に、2 つの異なるバージョンの jQuery を使用する必要はありません。常に、必要なプラグインと互換性のあるバージョンを見つけるようにしてください。または、サポートする予定のブラウザーと互換性のある最新バージョンを使用してください。プラグインの 1 つが非常に古いバージョンの jQuery でしか動作しない場合 (バージョン 1.43 以下のものなど)、別のプラグインを検討する必要があります。

したがって、頭次のようになります。

<script type='text/javascript' src='http://code.jquery.com/jquery-1.9.1.min.js'></script><!--older version jQuery-->
<script type='text/javascript' src='js/banner/jquery.mobile.customized.min.js'></script>
<script type='text/javascript' src='js/banner/jquery.easing.1.3.js'></script> 
<script type='text/javascript' src='js/banner/camera.min.js'></script>
<script type="text/javascript" src="js/jquery.sticky.js"></script>

<script>
    $(function() {
        $('#camera_wrap_4').camera({
            height: 'auto',
            loader: 'bar',
            pagination: false,
            thumbnails: false,
            hover: false,
            opacityOnGrid: false,
            imagePath: 'images/banner'
        });

        $("#nav").sticky({topSpacing:0});
    })
</script>

でも!

絶対に古い鯉を使いたいなら、解決策があります。

<script type='text/javascript' src='js/banner/jquery.min.js'></script><!--older version jQuery-->
<script type='text/javascript' src='js/banner/jquery.mobile.customized.min.js'></script>
<script type='text/javascript' src='js/banner/jquery.easing.1.3.js'></script> 
<script type='text/javascript' src='js/banner/camera.min.js'></script>

<script>
    var jqOld = jQuery.noConflict();
    jqOld(function() {
        jqOld('#camera_wrap_4').camera({
            height: 'auto',
            loader: 'bar',
            pagination: false,
            thumbnails: false,
            hover: false,
            opacityOnGrid: false,
            imagePath: 'images/banner'
        });
    })
</script>

<script type="text/javascript" src="js/jquery.js"></script>
<script>
    var jqNew = jQuery.noConflict();
    jqNew(function() {
        jqNew("#nav").sticky({topSpacing:0});
    })
</script>

…ほぼ正しいと思います…

詳細はこちら

そしてここ

そしてここ

そしてここ

http://blog.nemikor.com/2009/10/03/using-multiple-versions-of-jquery/


jQuery は、interwebz で最もサポートされている JS ライブラリです。使用している古い鯉の新しい「より良い」プラグインを見つけることは、決して難しいことではありません。通常、Google で約 5 ~ 10 分かかります。


于 2013-07-08T23:06:02.713 に答える
0

jquery.min.jsファイルとjquery.jsは異なるバージョンですか? jquery.min.js を削除して、jquery.js を他の先頭に配置してみてください

于 2013-07-08T22:48:36.260 に答える