タグ: 差し戻し済み モバイル編集 モバイルウェブ編集 |
タグ: 手動差し戻し モバイル編集 モバイルウェブ編集 |
25行目: |
25行目: |
|
| |
|
| resetInactivityTimer(); | | resetInactivityTimer(); |
| });
| |
|
| |
|
| |
| /*カスタムメニューバーの内容*/
| |
| document.addEventListener("DOMContentLoaded", function() {
| |
| // #content要素を取得
| |
| var contentElement = document.querySelector("#content");
| |
|
| |
| // 新しいdiv要素を作成
| |
| var newDiv = document.createElement("div");
| |
| newDiv.id = "mobileMenuBar";
| |
| newDiv.className = "fadeIn";
| |
| newDiv.style.display = "none";
| |
| newDiv.style.position = "fixed";
| |
| newDiv.style.top = "0px";
| |
|
| |
| // ul要素を作成
| |
| var ul = document.createElement("ul");
| |
| ul.className = "gNav-menu";
| |
|
| |
| // 各li要素を作成
| |
| var li1 = document.createElement("li");
| |
| var a1 = document.createElement("a");
| |
| a1.href = "./";
| |
| a1.textContent = "TOP";
| |
| li1.appendChild(a1);
| |
|
| |
| var li2 = document.createElement("li");
| |
| var a2 = document.createElement("a");
| |
| a2.href = "./RightMenu";
| |
| a2.textContent = "攻略メニュー";
| |
| li2.appendChild(a2);
| |
|
| |
| var li3 = document.createElement("li");
| |
| var a3 = document.createElement("a");
| |
| a3.href = ".//フォーラム";
| |
| a3.textContent = "コミュニティ";
| |
| li3.appendChild(a3);
| |
|
| |
| // li要素をulに追加
| |
| ul.appendChild(li1);
| |
| ul.appendChild(li2);
| |
| ul.appendChild(li3);
| |
|
| |
| // ulをdivに追加
| |
| newDiv.appendChild(ul);
| |
|
| |
| // divをcontentElementに追加
| |
| if (contentElement) {
| |
| contentElement.appendChild(newDiv);
| |
| }
| |
| });
| |
| /*カスタムメニューバーの設定*/
| |
| document.addEventListener("DOMContentLoaded", function() {
| |
| // 初期状態ではmobileMenuBarを非表示に設定
| |
| var mobileMenuBar = document.getElementById('mobileMenuBar');
| |
| mobileMenuBar.style.display = 'none';
| |
|
| |
| // スクロールイベントリスナー
| |
| window.addEventListener('scroll', function() {
| |
| // モバイルデバイスでの表示をチェック(例:幅が768px以下)
| |
| if (window.innerWidth <= 768) {
| |
| // ページの最上部からのスクロール距離を取得
| |
| var scrollDistance = window.scrollY;
| |
|
| |
| if (scrollDistance > 100) {
| |
| // 100px以上スクロールした場合、mobileMenuBarを表示
| |
| mobileMenuBar.style.display = 'block';
| |
| } else {
| |
| // 100px未満に戻った場合、mobileMenuBarを非表示
| |
| mobileMenuBar.style.display = 'none';
| |
| }
| |
| } else {
| |
| // モバイルデバイスでない場合、常に非表示
| |
| mobileMenuBar.style.display = 'none';
| |
| }
| |
| });
| |
|
| |
| // ウィンドウのサイズ変更時にもチェック
| |
| window.addEventListener('resize', function() {
| |
| if (window.innerWidth > 768) {
| |
| mobileMenuBar.style.display = 'none';
| |
| }
| |
| });
| |
| }); | | }); |