Question

我想让jQuery在页面上调整字体大小，但是对于指定了某个类的所有元素（.resizeFont）按比例调整。假设我希望大小加倍。

css链接到主html：

#titleText {
    font-size:50px;
}
#mainText {
    font-size:20px;
}
#footnoteText {
    font-size:8px;
}

主要的HTML：

<div id='#titleText'></div>
<div id='#mainText'></div>
<div id='#footnoteText'></div>

外部html文件中的

（单独文件中的每一行）：

<p class='someClass'>some text</p> // title.html

<p class='resizeFont'>some text</p> // main.html

<p class='resizeFont'>some text</p> // footnote.html

使用jQuery完成后，＃mainText和#footnoteText的字体大小应分别为40px和16px，但#titleText应保留50px大小

这里的方法是什么，我是否必须让jQuery构建一个包含.resizeFont的所有元素的数组，并通过数学乘法器处理它？</ p>

...我正在通过ajax加载文本，不确定这是否会影响字体属性的读/写方式

$.ajax({
   success : function (data) {
        $('#titleText').load('title.html');
        $('#mainText').load('main.html');
        $('#footnoteText').load('footnote.html');
   },
});

Answer 1

只需将font-size属性设置为某个percent值，就像

一样

table{ font-size:50% }

使用jQuery，你可以这样做，

$('table').css('font-size', '100%')

或者

$('table').css('font-size', '70%')

或单独为td

$("td.tablecol_0").animate({ 
    'width' : (xWidth * (15 / 100)) + 'px',
    'minWidth' : (xWidth * (15 / 100)) + 'px',
    'maxWidth' : (xWidth * (15 / 100)) + 'px',
    'fontSize' : (xWidth * (15 / 100)) + '%'
}, 1000);

如果您为所有100%设置了tds，那么您只需使用$(表).css('fontSize', '100%')。

DEMO.

http://jsfiddle.net/2xx6F/3/

jQuery动态地按比例调整字体大小

1 个答案: