本文实例讲述了jQuery实现切换字体大小的方法。分享给大家供大家参考。具体实现方法如下:
$.fn.switchSize = function(settings) {
// defaults settings
settings = $.extend({
container: \'body\',
arrSizeClass: [\'small\', \'medium\', \'large\'],
defaultClass: \'medium\',
saveCookie: true
}, settings);
var $container = $(settings.container);
return this
.each(function() {
if ($.cookie(\'switchSize\')) {
$container.addClass($.cookie(\'switchSize\'));
$(this).data(\"current\", $.cookie(\'switchSize\'))
}
})
.bind(\"click\", function() {
var pos;
if ($(this).data(\"current\")) {
pos = jQuery.inArray($(this).data(\"current\"), settings.arrSizeClass);
} else {
pos = jQuery.inArray(settings.defaultClass, settings.arrSizeClass);
}
if (pos >= 0) { //Found Class
if (pos == settings.arrSizeClass.length - 1) { //Check if last
$(this).data(\"current\", settings.arrSizeClass[0]);
} else {
$(this).data(\"current\", settings.arrSizeClass[pos + 1]);
}
} else {
//To prevent error
$(this).data(\"current\", settings.arrSizeClass[0]);
}
$container.removeClass(settings.arrSizeClass[pos]).addClass($(this).data(\"current\"));
if (settings.saveCookie === true) {
$.cookie(\'switchSize\', $(this).data(\"current\"), { expires: 365, path: \'/\' });
}
});
};
希望本文所述对大家的jQuery程序设计有所帮助。
本文地址:https://www.stayed.cn/item/16686
转载请注明出处。
本站部分内容来源于网络,如侵犯到您的权益,请 联系我