更新行をスクロールバーに表示
標準機能になったみたい 2022/3/9 増井俊之.icon
全行未読だと何も表示されないようだtakker.icon そういう仕様らしいです 増井俊之.icon
私は普通に表示すればいいと思うのですが、なんかウザいらしい 増井俊之.icon
まあわからんでもないかもtakker.icon
でもそれならDOM作ってdisplay: noneするだけでいいような
これなら表示したい人だけ表示できる
未読のとき表示するかどうかで 増井俊之.icon
以下のUserScriptを入れると未読でも表示されるようになります 増井俊之.icon
code:script.js
const dummyUnread = document.createElement('div')
dummyUnread.classList.add('unread')
const dummy = document.createElement('div')
dummy.classList.add('telomere')
dummy.appendChild(dummyUnread)
document.body.appendChild(dummy)
挙動に不満があるtakker.icon
テロメアとスクロールバーのツマミの位置にズレがある
smartphoneで特に気になった
と感じたのだが直っているかも
いややっぱりずれてる
たぶん同じことに言及している
クリックで該当箇所にジャンプしたい
これが無いのつらいyosider.icon
スクロールバー上でジャンプできるショートカットを使う手がある
/icons/Windows.icon/icons/GoogleChrome.icon:Shift+クリック
/icons/macOS.icon/icons/GoogleChrome.icon:Alt+クリック
/icons/firefox.icon:なさそう
windows firefox=shift+click
まあドラッグすればいいけどね
2023-01-09簡単なコードで作れたtakker.icon
一応、真ん中にスクロール位置を合せるか否で違いはあるけど……
今使った15分間は何だったの……?
問題演習を2週したと思うことにしよう
10:01:02 scrapbox.Layout !== "page"なページに遷移すると.scroll-bar-overlayが消えてしまう
対策として、layout:changedでlistenerを入れ直す
code:js
const render = () => {
document.getElementsByClassName("scroll-bar-overlay")0?.addEventListener?.("click", (e) => { if (!(e.target instanceof HTMLDivElement)) return;
if (!e.target.classList.contains("unread-bar")) return;
const ratio = parseFloat(e.target.style.top) * 0.01;
globalThis.scroll({
top: document.body.scrollHeight * ratio - globalThis.innerHeight /2
});
}, { capture: true });
};
render();
scrapbox.on("layout:changed", render);
ので作り直すつもり
どのへんが不満ですか? 増井俊之.icon