注册地址------登录地址
当前位置:主页 > 教程 > 网页设计 >

jQuery实现切换字体大小的方法
栏目分类:网页设计   发布日期:2015-09-02   浏览次数:

本文实例讲述了jQuery实现切换字体大小的方法。分享给大家供大家参考。具体实现方法如下:$ fn switchSize=function(settings){ defaultssettingssettings=$ extend({container:& 39;body& 39;,arrSizeClass:[&

本文实例讲述了jQuery实现切换字体大小的方法。分享给大家供大家参考。具体实现方法如下:

  1. $.fn.switchSize = function(settings) { 
  2.  
  3. // defaults settings 
  4.  
  5. settings = $.extend({ 
  6.  
  7.     container: 'body'
  8.  
  9.     arrSizeClass: ['small''medium''large'], 
  10.  
  11.     defaultClass: 'medium'
  12.  
  13.     saveCookie: true 
  14.  
  15. }, settings); 
  16.  
  17. var $container = $(settings.container); 
  18.  
  19. return this 
  20.  
  21.     .each(function() { 
  22.  
  23.         if ($.cookie('switchSize')) {  
  24.  
  25.         $container.addClass($.cookie('switchSize')); 
  26.  
  27.         $(this).data("current", $.cookie('switchSize'))  
  28.  
  29.         } 
  30.  
  31.     }) 
  32.  
  33.     .bind("click"function() { 
  34.  
  35.         var pos; 
  36.  
  37.         if ($(this).data("current")) { 
  38.  
  39.         pos = jQuery.inArray($(this).data("current"), settings.arrSizeClass); 
  40.  
  41.         } else { 
  42.  
  43.         pos = jQuery.inArray(settings.defaultClass, settings.arrSizeClass); 
  44.  
  45.         } 
  46.  
  47.         if (pos >= 0) { //Found Class 
  48.  
  49.         if (pos == settings.arrSizeClass.length - 1) { //Check if last 
  50.  
  51.             $(this).data("current", settings.arrSizeClass[0]); 
  52.  
  53.         } else { 
  54.  
  55.             $(this).data("current", settings.arrSizeClass[pos + 1]); 
  56.  
  57.         } 
  58.  
  59.         } else { 
  60.  
  61.         //To prevent error 
  62.  
  63.         $(this).data("current", settings.arrSizeClass[0]); 
  64.  
  65.         } 
  66.  
  67.   
  68.  
  69.         $container.removeClass(settings.arrSizeClass[pos]).addClass($(this).data("current")); 
  70.  
  71.   
  72.  
  73.         if (settings.saveCookie === true) { 
  74.  
  75.         $.cookie('switchSize', $(this).data("current"), { expires: 365, path: '/' }); 
  76.  
  77.         } 
  78.  
  79.     }); 
  80.  
  81. }; 

 

相关热词: javaScript教程

Copyright © 2002-2011 摩臣2注册帐号 版权所有   粤ICP备00000000号-1   关于我们 | 广告合作 | 版权声明 | 意见反馈 | 联系方式 | 原创投稿 | 网站地图 |
特效 教程 资源 资讯