我使用this script我想使用它将文本宽度设置为 50% 而不是 100%。 我们开始吧:
(function( $ ){
$.fn.fitText = function( kompressor, options ) {
var compressor = kompressor || 1,
settings = $.extend({
'minFontSize' : Number.NEGATIVE_INFINITY,
'maxFontSize' : Number.POSITIVE_INFINITY
}, options);
return this.each(function(){
var $this = $(this);
var resizer = function () {
$this.css('font-size', Math.max(Math.min($this.width() / (compressor*10), parseFloat(settings.maxFontSize)), parseFloat(settings.minFontSize)));
};
resizer();
$(window).on('resize.fittext orientationchange.fittext', resizer);
});
};
})( jQuery );
有什么想法如何重写它吗？
最佳答案
只需将文本容器设置为所需宽度的 50% 即可。
<head>
<script>
jQuery(".half-width-text").fitText(10);
</script>
<style>
.half-width-text {
width: 50%
}
</style>
</head>
<body>
<div class="full-width-container">
<div class="half-width-text">
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
tempor incididunt ut labore et dolore magna aliqua.
</div>
</div>
</body>
如果您需要避免新类并重写脚本，您可以向 DOM 元素添加宽度，就像使用 font-size 一样
var resizer = function () {
$this.css('font-size', Math.max(Math.min($this.width() / (compressor*10), parseFloat(settings.maxFontSize)), parseFloat(settings.minFontSize)));
$this.css('width', '50%');
};
关于javascript - 如何重写这个js脚本以将文本字段的宽度设置为50%？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/42072768/