|
|
| 1行目: |
1行目: |
| /* ✅ Citizenスキン完全対応版 Common.js */ | | mw.hook('wikipage.content').add(function ($content) { |
| | // すべての中身をここに入れて動かす |
| | console.log('✅ Citizen hook fired'); |
|
| |
|
| // トップに戻るボタン | | // 例：戻るボタン追加 |
| const toTopButton = $('<a href="# " id="toTop"> ↑ トップへ戻る</a>').css({ | | var btn = $('<a href="#"> ⬆︎ トップへ</a>').css({position: 'fixed', bottom: '20px'}).appendTo('body'); |
| position: 'fixed', bottom: '20px', right: '20px', background: '#555',
| | }); |
| color: '#fff', padding: '5px 10px', borderRadius: '4px', textDecoration: 'none', display: 'none', zIndex: 1000
| |
| }).appendTo('body');
| |
| | |
| $(window).on('scroll', function () {
| |
| toTopButton.toggle($(this).scrollTop() > 200);
| |
| });
| |
| | |
| toTopButton.on('click', function () {
| |
| $('html, body').animate({ scrollTop: 0 }, 500);
| |
| return false;
| |
| });
| |
| | |
| | |
| // 外部リンクを新規タブで開く
| |
| $content.find('a.external').attr('target', '_blank');
| |
| | |
| // 目次トグル
| |
| const toc = $content.find('#toc');
| |
| if (toc.length) {
| |
| toc.before('<button id="toggle-toc">目次を開閉</button>');
| |
| $('#toggle-toc').css({ margin: '5px', padding: '3px 6px', cursor: 'pointer' })
| |
| .on('click', function () {
| |
| toc.slideToggle();
| |
| });
| |
| }
| |
| | |
| // 画像に Lightbox 属性を追加
| |
| $content.find('a.image').attr('data-lightbox', 'image-gallery');
| |
| | |
| // セクション折りたたみ
| |
| $content.find('.mw-headline').css('cursor', 'pointer').on('click', function () {
| |
| $(this).parent().nextUntil('h2, h3, h4, h5, h6').slideToggle();
| |
| });
| |
| | |
| // 最近の更新ポップアップボタン
| |
| const recentBtn = $('<button id="recent-popup">最近の更新</button>').css({
| |
| position: 'fixed', bottom: '50px', right: '20px',
| |
| padding: '5px 10px', background: '#444', color: '#fff', borderRadius: '4px', cursor: 'pointer', zIndex: 1000
| |
| }).appendTo('body');
| |
| | |
| recentBtn.on('click', function () {
| |
| window.open(mw.util.getUrl('特別:最近の更新'), 'recentChanges', 'width=800,height=600');
| |
| });
| |
| | |
| // 読了時間表示
| |
| const text = $content.text();
| |
| const minutes = Math.ceil(text.length / 500);
| |
| $('<div id="read-time">⏳ 読了目安: ' + minutes + '分</div>').css({
| |
| padding: '5px', background: '#e2f0ff', borderRadius: '5px', display: 'inline-block', marginBottom: '10px'
| |
| }).prependTo($content);
| |
