Question

在编辑下面共享的代码后，我使用了下面的脚本。

我在下面的回复中编辑了工作文件，几乎完全相同的工作正常......

我似乎在遗漏某些东西......

非常感谢任何帮助。

这是我正在使用的Java脚本

<script type="text/javascript">
function resizeText(multiplier) {
var elem = document.getElementById("MiddleContent");
var currentSize = elem.style.fontSize || 1;
elem.style.fontSize = ( parseFloat(currentSize) + (multiplier * 0.2)) + "em";
}
</script>

这是表格代码：

<table border="0" id="MiddleContent">
<tr>
<td width="150" align="center">
<img src="../images/filler.jpg" width="146" height="104" />
</td>
<td  align="center" width="218" valign="middle">
<span style="color:#59461f; font-size:22px;">
Title of Story!
</span>
</td>
</tr>
<tr>
<td colspan="2" valign="top" style="font-size:14px">
<p>Lorem ipsum dolor sit amet, pellentesque tellus egestas, mauris cursus phasellus sit curabitur amet, molestias urna wisi.</p>
</td>
</tr>
</table>

最后这就是我的按钮：

<div id="fontSizeButton" align="center">
<table width="96" border="0">
<tr>
<td colspan="2" align="center">FONT SIZE</td>
</tr>
<tr>    
<td>
<input name="reSize" type="button" value="&nbsp;+&nbsp;" onclick="resizeText(1)" />
</td>
<td align="right">
<input name="reSize2" type="button" value="&nbsp;-&nbsp;" onclick="resizeText(-1)" />
</td>
</tr>
</table>
</div>

Answer 1

使用getElementById()引用该元素。正负方向也不需要2次，只需传递负数。

<强> HTML：

<div id="foo">
    XXX
</div>
<input name="reSize" type="button" value="&nbsp;+&nbsp;" onclick="resizeText(1)" />
<input name="reSize2" type="button" value="&nbsp;-&nbsp;" onclick="resizeText(-1)" />

<强> JavaScript的：

function resizeText(multiplier) {
    var elem = document.getElementById("foo");
    var currentSize = elem.style.fontSize || 1;
    elem.style.fontSize = ( parseFloat(currentSize) + (multiplier * 0.2)) + "em";
}

运行示例：

JSFiddle

Answer 2

我希望我清楚你要问的是什么。

如果您将代码中的body替换为getElementById("main")，其中“main”是您的div的ID，我认为它应该按照您的要求进行操作。

使用特定<div> </div>中的按钮更改字体大小

2 个答案: