js中html5修改字体大小,jquery设置字体大小插件

jquery-font-size-event.js是一款jquery设置字体大小插件。通过该jquery插件,你可以动态修改网页中指定区域的字体大小。

使用方法

在页面中引入jquery和jquery-font-size-event.js。

HTML结构

如果你想可以让客户动态的修改页面中的文章主体内容的文字大小,例如你的文章主体放在一个元素中。

这里是文章内容...

Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy...

然后你可以添加一组用于调整字体大小的元素。

请选择字体大小:

60%

80%

100%

120%

150%

300%

初始化插件

在页面DOM元素加载完毕之后,通过通过下面的方法来初始化该jquery设置字体大小插件。

$('.scaleRadio').on( 'change', function(event) {

var percent = 16*parseInt($(event.target).attr('value'))/100;

$('section').css('font-size', percent+'px');

});

$.onFontSizeChanged( function( e, fontSize ){

console.log('fontSize=', fontSize );

});