0

私は現在、2 つのワードプレス プラグインを、一方を他方のプラグインに合わせて書き直すことなく結合しようとしています。

最も基本的な私の質問は次のとおりです。別のプラグインの外部に存在する関数をどのように呼び出すのですか。例えば。私は2つのファイルを持っています:

1) js/N_Rotator.js

2) js/layerSlider.js

それらの 2 つは正しく機能します。1 つ目は、背景で回転するイメージです。2 つ目はコンテンツのローテーションです (つまり、タイトル、画像リンクなど)。

私がする必要があるのは、両方を同期することです。スライダー2が回転したら、スライダー1も回転させたい。

掘り下げた後、次のように Slider 2 から Slider 1 を開始できることがわかりました。

a('#carousel').infiniteCarousel({ anim('next'); });

しかし、anim() が終了しないというエラーが表示されます。したがって、スライダー 1 js 内で、変数内に配置しました。

 if(o.play) {
   anim('next');
 }  

次に、スライダー 2 から次のように呼び出します。

a('#carousel').infiniteCarousel({ play:1 });

しかし、それが行うのは、開始されるたびに最初から開始することだけです。一度スライドして最初に戻ります

では、関数を単独で呼び出す方法はありますか? これが anim() の構造です。(infiniteCarousel と呼ばれる以前に作成されたプラグインから取得)。

function anim(direction,dist)
            {
                // Fade left/right arrows out when transitioning
                $('#btn_rt'+randID).fadeOut(500);
                $('#btn_lt'+randID).fadeOut(500);

                // animate textholder out of frame
                $('#textholder'+randID).animate({marginBottom:(-imgHeight*o.textholderHeight)-(correctTHHeight * 2)+'px'},500);                 

                //?? Fade out play/pause?
                $('#pause_btn'+randID).fadeOut(250);
                $('#play_btn'+randID).fadeOut(250);



                if(direction == "next")
                {
                    if(curr==numImages) curr=0;
                    if(dist>1)
                    {
                        borderpatrol($('#thumb'+randID+'_'+(curr+dist)));
                        $('li:lt(2)', obj).clone().insertAfter($('li:last', obj));
                        $('ul', obj).animate({left:-imgWidth*(dist+1)},o.transitionSpeed,function(){
                            $('li:lt(2)', obj).remove();
                            for(j=1;j<=dist-2;j++)
                            {
                                $('li:first', obj).clone().insertAfter($('li:last', obj));
                                $('li:first', obj).remove();
                            }

                            $(this).css({'left':-imgWidth});
                            curr = curr+dist;
                            $('#thumbs'+randID+' div').bind('click', thumbclick).css({'cursor':'pointer'});
                        });
                    }
                    else
                    {
                        borderpatrol($('#thumb'+randID+'_'+(curr+1)));
                        $('#thumbs'+randID+' div').css({'cursor':'default'}).unbind('click'); // Unbind the thumbnail click event until the transition has ended
                        // Copy leftmost (first) li and insert it after the last li
                        $('li:first', obj).clone().insertAfter($('li:last', obj));  
                        // Update width and left position of ul and animate ul to the left
                        $('ul', obj)
                            .animate({left:-imgWidth-960},o.transitionSpeed,function(){
                                $('li:first', obj).remove();
                                $('ul', obj).css('left',-imgWidth+'px');
                                $('#btn_rt'+randID).fadeIn(500);
                                $('#btn_lt'+randID).fadeIn(500);
                                if(autopilot) $('#pause_btn'+randID).fadeIn(250);
                                if(autopilot)
                                {
                                    $('#progress'+randID).width(imgWidth).height(pbarHeight).fadeIn(500);
                                    $('#progress'+randID).fadeIn(500).animate({'width':0},o.displayTime,function(){
                                        $('#pause_btn'+randID).fadeOut(50);
                                        setTimeout(function(){$('#pause_btn'+randID).fadeIn(250)},o.transitionSpeed)
                                    });
                                }
                                curr=curr+1;
                                $('#thumbs'+randID+' div').bind('click', thumbclick).css({'cursor':'pointer'});
                            });
                    }
                }
                if(direction == "prev")
                {
                    if(dist>1)
                    {
                        borderpatrol($('#thumb'+randID+'_'+(curr-dist)));
                        $('li:gt('+(numImages-(dist+1))+')', obj).clone().insertBefore($('li:first', obj));
                        $('ul', obj).css({'left':(-imgWidth*(dist+1))}).animate({left:-imgWidth},o.transitionSpeed,function(){
                            $('li:gt('+(numImages-1)+')', obj).remove();
                            curr = curr - dist;
                            $('#thumbs'+randID+' div').bind('click', thumbclick).css({'cursor':'pointer'});
                        });
                    }
                    else
                    {
                        borderpatrol($('#thumb'+randID+'_'+(curr-1)));
                        $('#thumbs'+randID+' div').css({'cursor':'default'}).unbind('click'); // Unbind the thumbnail click event until the transition has ended
                        // Copy rightmost (last) li and insert it after the first li
                        $('li:last', obj).clone().insertBefore($('li:first', obj));
                        // Update width and left position of ul and animate ul to the right
                        $('ul', obj)
                            .css('left',-imgWidth*2+'px')
                            .animate({left:-imgWidth},o.transitionSpeed,function(){
                                $('li:last', obj).remove();
                                $('#btn_rt'+randID).fadeIn(500);
                                $('#btn_lt'+randID).fadeIn(500);
                                if(autopilot) $('#pause_btn'+randID).fadeIn(250);
                                curr=curr-1;
                                if(curr==0) curr=numImages;
                                $('#thumbs'+randID+' div').bind('click', thumbclick).css({'cursor':'pointer'});
                            });
                    }
                }
            }

そして、プラグインは次のように構成されています。

(function($) {

$.fn.extend({ 
    infiniteCarousel: function(options) {
        var defaults = {
            defaults...
        };
    var options = $.extend(defaults, options);

        return this.each(function() { ...anim is inside here... } }); })(jQuery);

プラグインを再起動せずに関数を呼び出す方法についてのアイデアはありますか??

注: サイトへのリンクを共有することはできません。まだ開発中であり、クライアントは無名のままにする必要があります。実際の例を示した方がよいでしょう。

4

1 に答える 1

0

JavaScript コード内で何が起こっているのかわかりませんが、あるスクリプトを別のスクリプトに依存させたい場合は、 wp_register_script() 関数に依存関係として追加してください。

于 2012-04-19T06:58:14.557 に答える