by mame-tanuki
2 days ago [2026/03/04 00:19:03]
「userId」で指定したユーザーあるいは、はてなドメインならURLから取得したユーザーIDのブックマーク一覧ページを画面左上に表示されるカレンダーから選択した日付別に表示するブックマークレット。
/*
* @title 昨日改
* @description 「userId」で指定したユーザーあるいは、はてなドメインならURLから取得したユーザーIDのブックマーク一覧ページを画面左上に表示されるカレンダーから選択した日付別に表示するブックマークレット。
* @include http://*
* @license MIT License
* @require
*/
javascript:(function(){
// 1. ユーザーIDの取得
let userId = 'mame-tanuki';
if (location.host === 'b.hatena.ne.jp') {
const match = location.pathname.match(/^\/([^\/]+)\//);
if (match) userId = match[1];
}
// 2. 入力フォーム（date型）の作成
const input = document.createElement('input');
input.type = 'date';
// スタイル調整：スマホでも見やすく中央に配置
Object.assign(input.style, {
position: 'fixed',
top: '20%', // スマホのキーボードやパネルを考慮して少し上に
left: '50%',
transform: 'translateX(-50%)',
zIndex: '2147483647', // 最大の重なり順
padding: '12px',
fontSize: '18px', // モバイルでズームされないサイズ
border: '2px solid #00A4DE',
borderRadius: '8px',
backgroundColor: '#fff',
boxShadow: '0 4px 20px rgba(0,0,0,0.4)'
});
// 初期値を「昨日」に設定
const d = new Date();
d.setDate(d.getDate() - 1);
input.value = d.toISOString().split('T')[0];
// 3. 日付が選択された時の処理
input.onchange = function() {
const val = input.value.replace(/-/g, '');
if (val) {
location.href = `https://b.hatena.ne.jp/${userId}/${val}`;
}
// 遷移するので削除は不要だが一応
if(input.parentNode) document.body.removeChild(input);
};
// 【改善点】スマホで消える対策：onblurをあえて設定しない、
// もしくはクリック以外の意図しない動作で消えないように調整
// キャンセルしたい場合は、日付以外の場所をタップしても消えるように別途実装も可能
// 4. 画面に追加して実行
document.body.appendChild(input);
// showPicker() は最新ブラウザでカレンダーを自動展開するメソッド
if (input.showPicker) {
input.showPicker();
} else {
input.focus();
}
})();