jqueryプラグインを使用してアニメーション化されたモーダルを作成する

Question

メインのhtmlページをクリックするとトリガされる、カスタマイズ可能なjQueryモーダルを作成したい（CSSの色の変更+フェードインとフェードイン）。私はオプション変数をjqueryプラグインに渡す方法を知っていますが、プラグイン内でどのようにアニメーション化するかわかりません。例：インラインjQueryを使ってあなただけの言うことができる：

<script> $("#modal").animate({color: 'red', width: 300}).fadeIn('fast'); </script>

どのように私は、プラグイン内でこれらの同じ変更を加えることができるだろうか？ここでは、コードの塊が（ジェフ・ウェイズjQueryプラグインのチュートリアルを使用しようとしていたです。

var mybigmodal= { 
     init: function(options, elem) { 
      var self = this; 

      self.elem = elem; 
      self.$elem = $(elem); 

      if (typeof options === 'string') { 
       var w = 400; 
       var h = 600; 
      } else { 
       //object was passed 
       self.options = $.extend({}, $.fn.mymodal.options, options) 

      } 

      self.mshow(); 
     }, 

     mshow: function() { //show the modal via animation? 


      $('#lightbox-pane').fadeIn(50).animate({ 
       width: 50}, 150).animate({ 
        width: 100},200); 
      } 
     }; 
    }); 

私は私のためにこれをコーディングする誰かを必要としない、私はちょうど私が間違ってやって知っていただきたいと思いますこれらの同じアニメーションがインラインながら、とてもシンプルであることが起こるようにするため。..

に私は本当にだけでなくカスタムの幅や色などのオプションを使用できるようにユーザーを有効にしたいと思います。

（私はこれはおそらくnoobの基本的な質問を知っていますが、どんな助けもありがとう！）

Answer 1

あなたはプラグインコード内でこのような何かを試すことができます。

まず

var options = $.extend({ 
      height : "250", 
      width : "500", 
      color: "red", 
      title:"Modal Box Demo", 
      description: "Example of how to create a modal box.", 
      top: "20%", 
      left: "35%", 

     },prop); 


     $('#modal').animate({top:'toggle'},80); 

としてあなたのプラグインのオプションを拡張します