Android の Firefox でネットを見ているとたまにとても文字が小さいサイトがあって拡大できないことがあると思う。そんな時 Tampermonkey とそこで動くスクリプトを書くと問題を解決できることがある。
Tampermonkey は、ブラウザの機能拡張で任意の Javascript を動かせるようになる。書くのが面倒ではあるがこれを使うとブラウザ画面上の表示や操作を改変することができる。スマホブラウザでこれができるのは知る限りAndroid + Firefox の組み合わせだけ、PC なら chrome 系ブラウザでも同様のことができる。
また、Tampermonkey は変遷があって過去には Violetmonkey とかいろいろ xxx monkey に主流がうつっているが最近は Tampermonkey で落ち着いている模様。
自分は正直、ブラウザで動く Javascript を書くのは得意でもないし好きでもない。ただただ面倒なので Claude か Bing Copilot に書いてもらった。
最初に文字を10 % 大きくするスクリプトを生成し、後から大/小ボタンを追加するコードを生成してもらった。
それらをそれぞれ動作確認して、くっつけたのが以下。
@match の行を適当に対象サイトに絞り込むように設定するとそのマッチするサイトでだけスクリプトが動くようになる。
// ==UserScript==
// @name 文字サイズを調整する
// @namespace http://tampermonkey.net/
// @version 0.1
// @description サイト全体の文字を10%大きくし、文字サイズを調整するボタンを追加します
// @author You
// @match *://*/*
// @grant none
// ==/UserScript==
// http://*/*
(function() {
'use strict';
// 全ての要素を取得
var all = document.getElementsByTagName("*");
// 各要素のフォントサイズを10%大きくする
for (var i=0, max=all.length; i < max; i++) {
var style = window.getComputedStyle(all[i], null).getPropertyValue('font-size');
var fontSize = parseFloat(style);
all[i].style.fontSize = (fontSize * 1.1) + 'px';
}
// ボタンを作成する関数
function createButton(value, scale) {
var button = document.createElement("button");
button.innerHTML = value;
button.style.margin = '4px';
button.onclick = function() {
for (var i=0, max=all.length; i < max; i++) {
var style = window.getComputedStyle(all[i], null).getPropertyValue('font-size');
var fontSize = parseFloat(style);
all[i].style.fontSize = (fontSize * scale) + 'px';
}
};
//document.body.appendChild(button);
document.body.insertBefore(button, document.body.firstChild)
}
// ボタンを作成
createButton("文字を小さく", 0.95);
createButton("文字を大きく", 1.05);
})();
参考
以下に、いろいろなユーザスクリプトがあるのでダウンロードして使うのもいい。
OpenUserJS アクセス制限が厳しく 10 秒に一回くらいしかリクエストできないので注意
Greasy Fork – safe and useful user scripts
