[英]How can I dynamically increase font size with Javascript and why is my current function not working?
I'm trying to increase the font size of my page using a javascript function but it's not working. 我正在尝试使用javascript函数来增加页面的字体大小,但无法正常工作。 Is there a syntax problem with my code or is it not possible to do what I'm trying to do?
我的代码是否存在语法问题,或者无法执行我想做的事情?
Javascript: 使用Javascript:
function changeFontSize(fontvar) {
var div = document.getElementById("webchat_history");
var currentFont = div.style.fontSize.value;
div.style.fontSize = currentFont + fontvar+ "px";
}
HTML: HTML:
<span onClick="changeFontSize(10);" style="font-size:16px;">Aa</span>
I want to increase it by x amount (fontvar) rather than specifying a specific font size because my font sizes are set in an external stylesheet. 我想通过x数量(fontvar)来增加它,而不是指定特定的字体大小,因为我的字体大小是在外部样式表中设置的。 When/if I need to modify the stylesheets, I'd rather not have to update the Javascript too.
当/如果我需要修改样式表,我宁愿不必也更新Javascript。
This script should work: 该脚本应该工作:
function changeFontSize(fontvar) {
var div = document.getElementById("webchat_history");
var currentFont = div.style.fontSize.replace("px", "");
div.style.fontSize = parseInt(currentFont) + parseInt(fontvar) + "px";
}
I found this amazing script: https://github.com/simplefocus/FlowType.JS 我发现了这个惊人的脚本: https : //github.com/simplefocus/FlowType.JS
Demo: http://simplefocus.com/flowtype/demo.html 演示: http : //simplefocus.com/flowtype/demo.html
After additional debugging, I realized the "id" I was using, webchat_history
, was not actually an ID. 经过额外的调试后,我意识到我使用的“ id”
webchat_history
实际上不是一个ID。 It was the class for ID history
. 这是ID
history
的课程 。 I'm going to create additional classes and use document.getElementById('history').className = "webchat_history_medium";
我将创建其他类并使用
document.getElementById('history').className = "webchat_history_medium";
to change font sizes. 更改字体大小。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.