1

我正在开发一个在每台设备上看起来几乎相同的网站。即笔记本电脑、PC、ipad、iphone 和其他智能手机。

我正在使用纯 javascript 的 fittext.js，以便根据用户的屏幕分辨率减少/增加网站上的字体大小。

但是，字体在 iphone 等设备上非常小！

如何在 iphone 和其他智能手机上增加字体大小？

这是我正在使用的 javascript 代码：

fittext.js

(function(){
  var css = function (el, prop) {
    return window.getComputedStyle ? getComputedStyle(el).getPropertyValue(prop) : el.currentStyle[prop];
  };

  var addEvent = function (el, type, fn) {
    if (el.addEventListener)
      el.addEventListener(type, fn, false);
        else
            el.attachEvent('on'+type, fn);
  };

  window.fitText = function (el, kompressor) {

    var settings = {
      'minFontSize' : -1/0,
      'maxFontSize' : 1/0
    };

    var fit = function (el) {
      var compressor = kompressor || 1;

      var resizer = function () {
        el.style.fontSize = Math.max(Math.min(el.clientWidth / (compressor*10), parseFloat(settings.maxFontSize)), parseFloat(settings.minFontSize)) + 'px';
      };

      // Call once to set.
      resizer();

      // Bind events
      // If you have any js library which support Events, replace this part
      // and remove addEvent function (or use original jQuery version)
      addEvent(window, 'resize', resizer);
    };

    if (el.length)
      for(var i=0; i<el.length; i++)
        fit(el[i]);
    else
      fit(el);

    // return set of elements
    return el;
  };
})();

这是在我的 HTML 页面中：

<script src="fittext.js"></script>
<script type="text/javascript">
  fitText(document.getElementById('fittext'), 2.9)
</script>
4

1 回答 1

2

Fittext 的建议用法是它不应该用于信息段落。对于移动网站，请确保您设置了移动视口，然后为较小的设备更改字体大小的最简单方法是使用媒体查询。

于 2013-07-21T11:22:32.023 回答