[ 一线风 | 2009-4-20 14:33:35 | 阅读: 771 | 分类: 项目文档 | Tag: JQuery 插件 formStyle | 永久链接 | 评论: 0 ]

CSCMS正式开工了, 里面有用到样式的切换,看到动网的办法是直接写的javascript, 因为最近看了一下JQuery发现真的是小巧精悍,比较喜欢.就用上了.先放出来,嘿嘿,最学乍练的.有啥不对的提出来.

jquery.formStyle.js
  1. /**  
  2. * author : atwind  
  3. * url       : http://max.cszi.com  
  4. * use     : $(function(){$(".objClassName").formStyle({className:"button_on"});};  
  5. **/  
  6.   
  7. $.fn.formStyle = function(options) {   
  8.     var settings = {   
  9.         version             :   '0.10',    
  10.         onEvent             :   'hover'//focus,blur,hover is default   
  11.         className           :   ''  //事件发生时切换的样式   
  12.     };   
  13.     if(options) {   
  14.         $.extend(settings, options);   
  15.     }   
  16.        
  17.     var eStyle = settings['onEvent'] ;   
  18.     if(eStyle == 'hover')   
  19.         this.hover(function(){$(this).addClass(settings['className']);},function(){$(this).removeClass(settings['className']);});   
  20.   
  21.     if(eStyle == 'focus')   
  22.         this.bind(function(){$(this).addClass(settings['className']);});       
  23.            
  24.     if(eStyle == 'blur')   
  25.         this.bind(function(){$(this).removeClass(settings['className']);});   
  26.            
  27. };   
  28.   
  29.   
  30.   
  31.   

 阅读全文及评论...