Question

我正在尝试根据字符长度调整标题大小。（WordPress的）

这是我到目前为止所拥有的。它不会返回任何错误，但它不起作用。

jQuery(function ($) {
    $(window).load(function () {
        var textLength = $('.autotitle').val().length;
        if (textLength < 20) {
            // Do noting 
        } else if (textLength > 20) {
            $('.autotitle').css('font-size', '16px');
        }
    });
});

Answer 1

很多时候，当文字很长时，人们希望减少字体大小（使其变小）（文本可能是通过某些CMS或翻译文本输入的）

http://jsfiddle.net/jfbrLjt2/

 $('.text').each(function(){
     var el= $(this);
       var textLength = el.html().length;
        if (textLength > 20) {
            el.css('font-size', '0.8em');
        }
});

Answer 2

 <span style="font-size:1vw;">test</span>

1vw代表视口宽度的1％ - 对于响应设计而言。

检查一下：http://css-tricks.com/viewport-sized-typography/

Answer 3

试试这个，Demo使用html而不是val

       var textLength = $('.autotitle').html().length;

Answer 4

用php函数解决了它

function trim_title() {
$title = get_the_title();
$limit = "14";

if(strlen($title) <= $limit) {
echo $title;
} else {
echo '<span class="longtitle">'; echo $title; echo '</span>';
}
}

感谢大家。

Answer 5

如果您使用.autotitle，则更改将应用于您使用.autotitle作为class属性的每个元素...

相反，您可以使用特定元素的id属性将更改仅应用于该元素

前：

$('#id').css('font-size','16px');

根据字符数动态更改字体大小

5 个答案: