2011-10-26 38 views
1

好吧,我正在学习编写插件和插件创作jQuery网站是该死的混乱。我真的想弄清楚如何添加方法到我的插件,将基于浏览器事件触发。所以基本上我有一个插件为移动设备构建了一个可滑动的幻灯片放映。当设备旋转时,我需要它重建新尺寸的幻灯片。现在我拥有它,所以它第一次构建它,但我不能(a)找出为不同功能添加方法和(b)将事件绑定到这些特定方法。这是我的代码。jquery插件开发,附加浏览器事件和方法

(function($){ 

    $.fn.jCarousel = function(options) { 
    var empty = {} 

    var defaults = { 
     height: $(window).height(), 
     width: $(window).width(), 
     count: 1, 
     amount: $('.swiper', this).length, 
     thisone:this, 
    }; 

    var options = $.extend(empty, defaults, options); 

    return this.each(function() { 

     options.thisone = this; 

     amount = $('.swiper', this).length; 
     holdWidth = options.width * options.amount; 

     $('.swiper', this).height(options.height); 
     $(this).height(options.height); 
     $('.swiper', this).width(options.width); 
     $(this).width(holdWidth); 
     $('.swipe_slide',this).width(holdWidth); 

     //================================================================================================================== 
     //================================================================================================================== 

     $('.swiper', this).each(function(i) { 
      var nwidth = options.width*i; 
      $(this).css('left',nwidth); 
     }); 
     //================================================================================================================== 
     //==================================================================================================================  
     //================================================================================================================== 
     //================================================================================================================== 

     $('.swipe_slide', this).swipe(function(evt, data) { 
      if(data.direction=='left'){ 
       //alert('count: '+options.count+" amount: "+options.amount); 
       if(options.count != options.amount){ 
        moveWidth = options.count * -options.width; 
        $('.swipe_slide',options.thisone).css("left" ,moveWidth); 
        options.count++ 
       }else{ 
        return  
       } 
      }else{ 
       if(options.count!=1){  
        moveWidth = moveWidth+ options.width; 
        $('.swipe_slide',options.thisone).css("left" ,moveWidth); 
        options.count-- 
       } 
       else{ 
        return 
       } 
      } 
     });  
     //==================================================================================================================  
     //================================================================================================================== 
     }); 
    }; 

})(jQuery); 

回答

1
$(window).bind('orientationchange', $.fn.jCarousel); 

你将不得不重构你的插件一下,让该功能可存储传递到它的选项,否则在方向变化再次运行该功能将重置选项为默认值。