ブックマークレットの作り方
今まで全然知らなかったけれど、調べてみたらすごく簡単でした。
■ ブックマークレットの作り方
https://slash-mochi.net/?p=1266
(なぜかリッチリンクが使えなかったのでテキストリンクです)
上記記事がメッチャ分かりやすかったです。
要するにURL欄に「javascript:」で書き始めるとJSが動かせるので、ソレをブックマーク欄に登録すればブックマークレットになりますよ、というものでした。
上記記事によるとjQueryも使えます。
でもjQueryが許されるのは小学生までだよねー、キャハハハハハ。
うっ…(´;ω;`)
心は小学生なのでノーカンです。
実際に作ってみた「日テレニュース24を全画面で見るブックマークレット」は下記です。
javascript:
//最初にjQueryを読み込む
! function (d, f, s) {
s = d.createElement("script");
s.src = "//code.jquery.com/jquery-3.3.1.min.js";
s.onload = function () {
f(jQuery.noConflict(1))
};
d.body.appendChild(s)
}(document, function ($) {
//ここからが実際に動く部分
if ("www.news24.jp" == location.hostname) {
$("video").parent("div").css({
width: "100vw",
height: "100vh",
position: "absolute",
left: "0",
top: "0",
"z-index": "1000"
});
$("html").css("overflow", "hidden");
} else {
location.href = "http://www.news24.jp";
}
})
実際には上記のコードをminifyしてaタグのhrefに書いてます。
なお動くやつは百済に置いてあります。
単純にvideo要素の親要素をブラウザサイズで全画面にしています。
デベロッパーツールとかに手打ちでも良いんだけど、毎回打つのが面倒なのでブックマークレットにしました。
日テレニュース24以外のサイトで動くと何が起こるかわからないので、日テレニュース24じゃないサイトで押すと日テレニュース24にジャンプします。
ブックマークレットですが、少し調べてみるとなかなか奥が深い、というか便利な開発方法が色々あるようです。
人類にとっては小さな一歩ですが、僕にとっては大きな一歩となりました。
この記事が気に入ったらサポートをしてみませんか?