gwt - GWT - 增加和减少字体大小

Question

在 GWT Web 应用程序中，我想让我的用户有机会减少或增加当前页面的字体大小。

如果用户单击 + 按钮，是否可以在 GWT 中执行此操作：

body { font-size: 150%; }

为此，如果用户单击 - 按钮：

body { font-size: 50%; }

谢谢！

Answer 1

这适用于 CSS 内联解决方案。替换CLASSNAMEHERE以适合您的需要，或将其作为函数的参数传递。

private static native void changeFontSize(int inc)/*-{
        {
            var p = $doc.getElementsByClassName('CLASSNAMEHERE');
            for (n = 0; n < p.length; n++) {
                if (p[n].style.fontSize) {
                    var size = parseInt(p[n].style.fontSize.replace("px", ""));
                } else {
                    var size = 11;
                }
                p[n].style.fontSize = size + inc + 'px';
            }
        }
    }-*/;

Answer 2

请尝试以下操作：

Document.get().setStyleAttribute("font-size", "150%");

如果您需要修改特定样式类的样式，那么您应该先以某种方式查询它们。（以原生 JS 或http://code.google.com/p/gwtquery/为例）然后迭代它们并修改样式属性

DOM.setStyleAttribute(someGwtElement.getElement(), "font-size", "150%");