はなぜプラグインが

Question

は私が作成した基本的なスライダーを持って実行していません私は同じページで何度でも使うことができます。

私はそもそも単純なものを作成するには、このページを見ていた：https://learn.jquery.com/plugins/basic-plugin-creation/

だから私は（テストのように）、以下を思い付いた：

それが必要チュートリアルに基づいて

<div> 
    <div class="test1">This is a test</div> 
</div> 
<script> 
    $(".test1").SliderS({ 
     color: "#00FF00" 
    }); 
</script> 
<script> 
    (function ($) { 
     $.fn.SliderS = function (options) { 
      var settings = $.extend({ 
       autoSlide: 1, 
       timeoutSet: 4000, 
       displayNav: 1, 
       color: "#F00FFF" 
      }, options); 

      return this.css({ color: settings.color }); 
     }; 
    }(jQuery)); 
</script> 

テキストの色を変更しますが、変更しませんでした。

どうすれば解決できますか？

また、私のスライダの静的コードを何度も使用するプラグインに変換する最も良い方法は何ですか？

Answer 1

定義する前にプラグインを呼び出しています。順序を切り替えて、それが正常に動作します：

(function($) { 
 
    $.fn.SliderS = function(options) { 
 
    var settings = $.extend({ 
 
     autoSlide: 1, 
 
     timeoutSet: 4000, 
 
     displayNav: 1, 
 
     color: "#F00FFF" 
 
    }, options); 
 

 
    return this.css({ 
 
     color: settings.color 
 
    }); 
 
    }; 
 
}(jQuery)); 
 

 
$(".test1").SliderS({ 
 
    color: "#00FF00" 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
 
<div> 
 
    <div class="test1">This is a test</div> 
 
</div>