Question

所以，做

之类的事情很容易

$('.someClass').css(....);

直接在HTML中添加内联样式。但是，如果我想创建一个实际的规则呢？

.someClass {
  ....
 }

然后能够在像window.resize（）这样的东西上编辑新规则。

我要做的是编写一个动态生成字体大小的脚本，然后将其同等地应用于某个类的所有元素（它调整文本大小以使其保持在一行上）。每次窗口调整大小时，脚本都会将字体设置为3，然后循环，将字体大小增加1，直到它尽可能大，而不会破坏另一条线（超过给定高度）。这是完整的脚本供参考。

$.fn.fitText = function (height) {
  return this.each(function () {
    console.log(this);
    $(this).css('font-size', '3px');
    var newSize;

    while ($(this).height() < height) {
      newSize = parseInt(jq11(this).css('font-size'), 10) + 1;
      $(this).css('font-size', newSize);
    }

    newSize = parseInt($(this).css('font-size'), 10) - 1;
    $(this).css('font-size', newSize);

  });
};

有效，因为我可以打电话

$('.sectionTitle').fitText(25);

它将在该文本的所有实例上运行，增加它们的大小，直到它们尽可能大并且仍然小于25px高（一行）。但它可以单独对每个元素进行处理，从而导致文本大小变化，看起来很傻。我希望它能够计算出它可以设置的最大字体大小，这样任何元素都不会超过一行，然后将该样式应用于所有元素。

JavaScript或Jquery，创建样式规则

0 个答案: