根据屏幕大小更改问候语

Question

我想知道如何根据屏幕大小更改问候语。目前它在较小的屏幕上看起来不太好。

我不擅长 jQuery/JS 所以我使用了 if 语句来检查宽度并根据它更改问候语。这样做的问题是它只在页面加载时这样做。我希望每次尺寸更新时它都会改变。

在 this website 底部的演示中，问候语会根据屏幕的宽度而变化。

有什么帮助吗？

祝你有愉快的一天，

漫游者

Answer 1

最简单的方法是添加 onInit 和 echo 函数，它们将在调整大小时发生的每次重绘时调用：

term.echo(function() {
    return new Array(this.cols()).fill('-').join('');
});

这将创建始终为终端全宽的行。如果您准备了多条问候语，那么您只需使用 if 语句和 return 带有您想要的问候语的适当字符串创建函数，这就是创建默认问候语的方式。

函数内的this将与终端实例相同，cols是每行return字符数的方法。

所以整个代码（如果你没有登录）应该是这样的：

$('body').terminal(..., {
    greetings: false, // disable default greetings
    onInit: function() {
        this.echo(function() {
            return new Array(this.cols()).fill('-').join('');
        });
    }
});

如果您使用登录，您需要使用 onAfterLogin 而不是 onInit 如果您想要与问候语相同的行为。

根据屏幕大小更改问候语

Changing greeting based on screensize

jquery-terminal