0

私は異なるバージョンの 2 つの jquery の同じプラグインを使用していますが、1 つは本体でのみ機能し、もう 1 つは頭でのみ機能します。

このチュートリアルに従って、競合なしで使用してみました: Using different versions of jQuery and jQueryUI together

しかし、何も、1つのプラグインが本体から呼び出され、もう1つのプラグインが頭から呼び出されることに関連している可能性があると思います.とにかく、これを解決するための提案があるかもしれません:D

/*This is the head plugin*/
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js" type="text/javascript"></script>

/*And this is the body plugin*/
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js" type="text/javascript" ></script>

<script type="text/javascript" src="jquery.easing.1.3.js"></script>
<script type="text/javascript">
    $(function() {
        var current = 1;
        var iterate = function(){
            var i = parseInt(current+1);
            var lis = $('#rotmenu').children('li').size();
            if(i>lis) i = 1;
            display($('#rotmenu li:nth-child('+i+')'));
        }
        display($('#rotmenu li:first'));
        var slidetime = setInterval(iterate,3000);

        $('#rotmenu li').bind('click',function(e){
            clearTimeout(slidetime);
            display($(this));
            e.preventDefault();
        });

        function display(elem){
            var $this = elem;
            var repeat = false;
            if(current == parseInt($this.index() + 1))
                repeat = true;

            if(!repeat)
                $this.parent().find('li:nth-child('+current+') a').stop(true,true).animate({'marginRight':'-20px'},300,function(){
                    $(this).animate({'opacity':'0.7'},700);
                });

            current = parseInt($this.index() + 1);
            var elem = $('a',$this);

            elem.stop(true,true).animate({'marginRight':'0px','opacity':'1.0'},300);

            var info_elem = elem.next();
            $('#rot1 .heading').animate({'left':'-420px'}, 500,'easeOutCirc',function(){
                $('h1',$(this)).html(info_elem.find('.info_heading').html());
                $(this).animate({'left':'0px'},400,'easeInOutQuad');
             });

             $('#rot1 .description').animate({'bottom':'-270px'},500,'easeOutCirc',function(){
                $('p',$(this)).html(info_elem.find('.info_description').html());
                $(this).animate({'bottom':'0px'},400,'easeInOutQuad');
            })
            $('#rot1').prepend(
                $('<img/>',{
                    style: 'opacity:0',
                    className: 'bg'
                }).load(
                    function(){
                        $(this).animate({'opacity':'1'},600);
                        $('#rot1 img:first').next().animate({'opacity':'0'},700,function(){
                            $(this).remove();
                        });
                    }
                 ).attr('src','images/'+info_elem.find('.info_image').html()).attr('width','800').attr('height','300')
            );
        }
   });
</script>
4

1 に答える 1

0

ヘッドとボディで jQuery を 2 回インポートする必要はありません (?)...

すべてのプラグインをインポートして、ヘッドでスクリプトを宣言するだけです。

<html>

<head>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
    <script type="text/javascript" src="jquery.easing.1.3.js"></script>
    <script type="text/javascript">
        $(document).ready(function() {
            console.log("Inside the 'head' tag you declare your plugins, scripts, css, etc...");
        });
    </script>
</head>
<body>
    <p>Inside the body you build your page with divs, img's, p's, span's, etc ...</p>
</body>

</html>

ところで、1.3 と 1.9.1 の異なるバージョンの jQuery を使用していることに気付きました。最新バージョンのみを使用する必要があります。http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js

忘れないでください、jQuery は最初に宣言するスクリプトでなければならず、次にプラグイン、そして独自のコード...

于 2013-02-11T01:36:18.583 に答える