「MediaWiki:Mobile.js」の版間の差分

提供:パルワールド 攻略Wiki
移動先:案内検索
編集の要約なし
タグ: 差し戻し済み モバイル編集 モバイルウェブ編集
編集の要約なし
タグ: 手動差し戻し
 
(同じ利用者による、間の13版が非表示)
26行目: 26行目:
     resetInactivityTimer();
     resetInactivityTimer();
});
});
//Menu
// bgwrapper
/*mobilemenu*/
document.addEventListener('DOMContentLoaded', function() {
function isMobileDevice() {
     // 目的の要素を選択します。
     const userAgent = navigator.userAgent;
     var targetElement = document.querySelector('.pre-content.heading-holder');
     const screenWidth = window.innerWidth;


     // モバイルデバイスのユーザーエージェントをチェック(iPadを除外)
     // 目的の要素が存在する場合にのみ処理を進めます。
     const isMobileUA = /Android|webOS|iPhone|iPod|BlackBerry|IEMobile|Opera Mini/i.test(userAgent) && !/iPad/i.test(userAgent);
     if (targetElement) {
        // 新しい div 要素を作成します。
        var newDiv = document.createElement('div');
        newDiv.className = 'bgwrapper';


    // 画面サイズが特定の最大幅(例えば768px)以下かどうかをチェック
        // この新しい div を目的の要素の後に挿入します。
    const isSmallScreen = screenWidth <= 768;
         targetElement.parentNode.insertBefore(newDiv, targetElement.nextSibling);
 
    // 両方の条件を満たす場合にtrueを返す
    return isMobileUA && isSmallScreen;
}
window.onload = function() {
    if (isMobileDevice()) {
         document.getElementById('mobileMenuBar').style.display = 'block';
    }
};
 
/* メニューバー */
// メニューバー
var lastScrollTop = 0;
var menuBar = document.getElementById("mobileMenuBar");
var headerMenu = document.querySelector(".header-container.header-chrome"); // 本来のheadermenu
 
// 初期状態でmobileMenuBarを非表示にする
menuBar.style.display = 'none';
 
window.addEventListener("scroll", function() {
    var currentScroll = window.pageYOffset || document.documentElement.scrollTop;
 
    // headerMenuが画面から消えたかどうかをチェック
    var headerMenuBottom = headerMenu.offsetTop + headerMenu.offsetHeight;
    var isHeaderMenuVisible = headerMenuBottom > currentScroll;
 
    if (!isHeaderMenuVisible) {
        // headerMenuが見えなくなったらmobileMenuBarを表示
        menuBar.style.display = 'block';
        menuBar.style.position = 'fixed';
        menuBar.style.top = '0px';
    } else {
        // headerMenuが見える場合はmobileMenuBarを非表示
        menuBar.style.display = 'none';
     }
     }
   
});
    lastScrollTop = currentScroll <= 0 ? 0 : currentScroll;
}, false);

2024年1月17日 (水) 02:29時点における最新版

//トップに戻るボタン
$(document).ready(function() {
    var backToTopButton = $('<div/>', {
        id: 'back-to-top',
        html: '<i class="fa-solid fa-chevron-up"></i>',
        click: function() {
            window.scrollTo(0, 0);
        }
    }).appendTo('body');

    backToTopButton.show();

    var inactivityTimer;

    function resetInactivityTimer() {
        backToTopButton.show();
        clearTimeout(inactivityTimer);
        inactivityTimer = setTimeout(function() {
            backToTopButton.fadeOut();
        }, 2000);
    }

    $(window).scroll(resetInactivityTimer);
    $(window).mousemove(resetInactivityTimer);

    resetInactivityTimer();
});
// bgwrapper
document.addEventListener('DOMContentLoaded', function() {
    // 目的の要素を選択します。
    var targetElement = document.querySelector('.pre-content.heading-holder');

    // 目的の要素が存在する場合にのみ処理を進めます。
    if (targetElement) {
        // 新しい div 要素を作成します。
        var newDiv = document.createElement('div');
        newDiv.className = 'bgwrapper';

        // この新しい div を目的の要素の後に挿入します。
        targetElement.parentNode.insertBefore(newDiv, targetElement.nextSibling);
    }
});
Copyright © 2003-2024 ヘイグ All Rights Reserved.