2013-10-25 47 views
0

我使用this JQuery插件,我希望能夠動態地加載插件的配置,而不是從插件文件進行更改,這裏是插件的選項:負載jQuery插件配置動態

 $.Slitslider.defaults = { 
      // transitions speed 
      speed : 800, 
      // if true the item's slices will also animate the opacity value 
      optOpacity : false, 
      // amount (%) to translate both slices - adjust as necessary 
      translateFactor : 230, 
      // maximum possible angle 
      maxAngle : 25, 
      // maximum possible scale 
      maxScale : 2, 
      // slideshow on/off 
      autoplay : false, 
      // keyboard navigation 
      keyboard : true, 
      // time between transitions 
      interval : 4000, 
      // callbacks 
      onBeforeChange : function(slide, idx) { return false; }, 
      onAfterChange : function(slide, idx) { return false; } 
    }; 

在他們的演示文件中,他們給這個代碼:

<script type="text/javascript">   
        $(function() { 

          var Page = (function() { 

            var $nav = $('#nav-dots > span'), 
              slitslider = $('#slider').slitslider({ 
                onBeforeChange : function(slide, pos) { 

                  $nav.removeClass('nav-dot-current'); 
                  $nav.eq(pos).addClass('nav-dot-current'); 

                } 
              }), 

              init = function() { 

                initEvents(); 

              }, 
              initEvents = function() { 

                $nav.each(function(i) { 

                  $(this).on('click', function(event) { 

                    var $dot = $(this); 

                    if(!slitslider.isActive()) { 

                      $nav.removeClass('nav-dot-current'); 
                      $dot.addClass('nav-dot-current'); 

                    } 

                    slitslider.jump(i + 1); 
                    return false; 

                  }); 

                }); 

              }; 

              return { init : init }; 

          })(); 

          Page.init(); 


        }); 
      </script> 

所以我只是希望能夠從一個php文件動態加載插件的配置,我找到的唯一的解決辦法是改變從選項插件文件它自我,所以我需要加載所有的文件與PHP文件的腳本HTML標記!這是我覺得一個壞的解決方案,併爲確保有一個清潔的解決方案

謝謝

回答

0

我找到了解決辦法:

 <script type="text/javascript"> 
     $(function() { 

      var Page = (function() { 

       var $nav = $('#nav-dots > span'), 
        slitslider = $('#slider').slitslider({ 
         onBeforeChange : function(slide, pos) { 

          $nav.removeClass('nav-dot-current'); 
          $nav.eq(pos).addClass('nav-dot-current'); 

         }, 

         autoplay : true, 

         /* parameters goes here */ 
        }), 
...... 
</script>