コンフルブックマークレット
code:js
javascript:(function(){
/* 1. 左側サイドバーを閉じる(トグルボタンのシミュレート) */
const sidebarBtn = document.querySelector('buttonaria-label*="サイドバーを閉じる", buttonaria-label*="Close sidebar"');
if (sidebarBtn) {
sidebarBtn.click();
} else {
/* ボタンが見つからない場合のフォールバック(直接スタイル変更) */
const sidebar = document.querySelector('divdata-testid="sidebar"')?.parentElement;
if (sidebar) sidebar.style.display = sidebar.style.display === 'none' ? '' : 'none';
}
/* 2. 既存の独自目次があれば削除(二重生成防止) */
const oldToc = document.getElementById('custom-floating-toc');
if (oldToc) { oldToc.remove(); return; }
/* 3. 目次コンテナの作成とスタイル適用 */
const toc = document.createElement('div');
toc.id = 'custom-floating-toc';
Object.assign(toc.style, {
position: 'fixed',
top: '80px',
left: '20px',
width: '240px',
maxHeight: '80vh',
overflowY: 'auto',
backgroundColor: '#ffffff',
boxShadow: '0 4px 12px rgba(0,0,0,0.15)',
borderRadius: '8px',
padding: '16px',
zIndex: '9999',
fontSize: '14px',
fontFamily: '-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif',
borderLeft: '4px solid #0052CC'
});
/* タイトル */
const title = document.createElement('div');
title.innerText = '目次';
title.style.fontWeight = 'bold';
title.style.marginBottom = '12px';
title.style.color = '#172B4D';
title.style.borderBottom = '1px solid #DFE1E6';
title.style.paddingBottom = '6px';
toc.appendChild(title);
/* 4. ページ内の見出し(h2, h3)を抽出して目次を生成 */
const headers = document.querySelectorAll('h2, h3');
if (headers.length === 0) {
toc.innerHTML += '<div style="color:#7A869A;">見出しが見つかりません</div>';
} else {
const ul = document.createElement('ul');
ul.style.listStyle = 'none';
ul.style.padding = '0';
ul.style.margin = '0';
headers.forEach((header, index) => {
/* 認識用のIDがなければ付与 */
if (!header.id) {
header.id = 'toc-header-' + index;
}
const li = document.createElement('li');
li.style.marginBottom = '8px';
if (header.tagName === 'H3') {
li.style.paddingLeft = '12px';
li.style.fontSize = '13px';
}
const a = document.createElement('a');
a.href = '#' + header.id;
/* アイコン画像などが含まれる場合を考慮してテキストのみ抽出 */
a.innerText = header.innerText.replace(/\r\n+/g, ' ').trim();
a.style.color = '#0052CC';
a.style.textDecoration = 'none';
a.style.cursor = 'pointer';
/* ホバー効果 */
a.onmouseover = () => a.style.textDecoration = 'underline';
a.onmouseout = () => a.style.textDecoration = 'none';
/* スムーズスクロール */
a.onclick = (e) => {
e.preventDefault();
header.scrollIntoView({ behavior: 'smooth', block: 'start' });
};
li.appendChild(a);
ul.appendChild(li);
});
toc.appendChild(ul);
}
/* ページに目次を追加 */
document.body.appendChild(toc);
})();