Question

我正在尝试根据浏览器大小调整文本大小，这意味着当用户更改浏览器高度时，文本将变得更小或更大，如果用户更改宽度，则文本会再次变小或者大。

我有点jquery，但我对此很新，我不知道如何更改它。我还附上了一个小提琴。

这是代码：

jQuery(document).ready(function($) {
        var $body = $('body'); //Cache this for performance

        var setBodyScale = function() {
            var scaleFactor = 0.55,
                scaleSource = $(window).height(),
                maxScale = 600,
                minScale = 10;

            var fontSize = scaleSource * scaleFactor; //Multiply the width of the body by the scaling factor:

            if (fontSize > maxScale) fontSize = maxScale;
            if (fontSize < minScale) fontSize = minScale; //Enforce the minimum and maximums

            $('body').css('font-size', fontSize + '%');
        }

        $(window).resize(function(){
            setBodyScale();
        });

        //Fire it when the page first loads:
        setBodyScale();
    });

Answer 1

根据您所写的内容，文本调整得很好，因为调整浏览器窗口高度但是您没有添加任何内容来测试浏览器宽度。请参阅此更新fiddle

我修改了你的专栏：

scaleSource = $(window).height(),

到

scaleSource = ($(window).height()/2) + ($(window).width()/2),

我已经假设你的规模，但你明白了。

根据浏览器的高度和宽度缩放文本

1 个答案: