Question

我是jQuery和JS的新手，我正试图在移动网站上调整文字大小的屏幕宽度

我在网上搜索答案并提出了这个解决方案

                (function($) {
                $.fn.textfill = function(maxFontSize) {
                    maxFontSize = parseInt(maxFontSize, 10);
                    return this.each(function(){
                        var ourText = $("span", this),
                            parent = ourText.parent(),
                            maxHeight = parent.height(),
                            maxWidth = parent.width(),
                            fontSize = parseInt(ourText.css("fontSize"), 10),
                            multiplier = maxWidth/ourText.width(),
                            newSize = (fontSize*(multiplier-0.1)),
                            textHeight = ourText.height();
                            if(newSize > 35){
                                ourText.css("fontSize",35);
                            }
                            else{
                                ourText.css(
                                    "fontSize", 
                                    (maxFontSize > 0 && newSize > maxFontSize) ? 
                                        maxFontSize : 
                                        newSize
                                );
                            }
                    });
                };
            })(jQuery);


            $(document).ready(function() {
                    $('.jtextfill').textfill({ maxFontPixels: 36 });
            });

但是只有当页面首次重新加载而不是在窗口调整大小时，所以我将其全部输入到一个函数中并添加

            $(document).ready(function () {
            resizeTextHeb();
            $(window).resize(function() {
                resizeTextHeb();
            });
        });

但现在在iPhone / iPad / Android等上，当屏幕旋转时它不会重新加载功能。屏幕旋转不作为窗口调整大小？我该怎么做才能让它发挥作用？谢谢。感谢

Answer 1

您可以使用媒体查询，而不使用js。

Answer 2

您的函数名称是“resizeTextHeb（）”主要问题，任何函数名称都会发布！？我建议你使用谷歌chrome js控制台的错误报告或FF浏览器上的错误控制台。，无论如何，如果它确实提醒你，那么主要的问题是你的功能，而不是定位方法。

屏幕旋转时jQuery自动运行

2 个答案: