Update index.html

index.html

@@ -460,7 +460,7 @@
           background-color: #0f0f1a;
           border: 1px solid #0066ff;
           box-shadow: 0 0 15px rgba(0, 102, 255, 0.5);
-          z-index: 100000;
+          z-index: 2147483647 !important;
           display: none;
           min-width: 200px;
         }
@@ -619,8 +619,7 @@
     <canvas id="canvas">
     </canvas>
     <!-- サムネイル用の非表示video要素 -->
-    <video id="video-for-thumbnail" src="v.mp4" preload="auto" style="display:none;">
-    </video>
+    <video id="video-for-thumbnail" src="v.mp4" preload="auto" style="display:none;"></video>
     <script>
     const video = document.getElementById('videoPlayer');
         const videoSelect = document.getElementById('videoSelect');
@@ -974,12 +973,24 @@ function setupFramePreview() {
         }
         
         // 右クリックメニュー関連
-        function showContextMenu(e) {
-          e.preventDefault();
-          contextMenu.style.display = 'block';
-          contextMenu.style.left = `${e.clientX}px`;
-          contextMenu.style.top = `${e.clientY}px`;
-        }
+function showContextMenu(e) {
+    e.preventDefault();
+    
+    // メニューの位置を計算
+    const x = e.clientX || e.touches?.[0]?.clientX;
+    const y = e.clientY || e.touches?.[0]?.clientY;
+    
+    if (!x || !y) return;
+    
+    contextMenu.style.display = 'block';
+    contextMenu.style.left = `${x}px`;
+    contextMenu.style.top = `${y}px`;
+    
+    // 全画面時は document にイベントリスナーを追加
+    if (document.fullscreenElement) {
+        document.addEventListener('click', hideContextMenu);
+    }
+}
         
         function hideContextMenu() {
           contextMenu.style.display = 'none';
@@ -1085,10 +1096,21 @@ function setupFramePreview() {
         fullscreenBtn.addEventListener('click', goFullscreen);
     
         // 全画面変更イベントを監視
-        document.addEventListener('fullscreenchange', updateSubtitleScaleForFullscreen);
-        document.addEventListener('webkitfullscreenchange', updateSubtitleScaleForFullscreen);
-        document.addEventListener('mozfullscreenchange', updateSubtitleScaleForFullscreen);
-        document.addEventListener('MSFullscreenChange', updateSubtitleScaleForFullscreen);
+document.addEventListener('fullscreenchange', updateFullscreenEventListeners);
+document.addEventListener('webkitfullscreenchange', updateFullscreenEventListeners);
+document.addEventListener('mozfullscreenchange', updateFullscreenEventListeners);
+document.addEventListener('MSFullscreenChange', updateFullscreenEventListeners);
+
+function updateFullscreenEventListeners() {
+    if (document.fullscreenElement) {
+        // 全画面時は document にイベントリスナーを設定
+        document.addEventListener('contextmenu', showContextMenu);
+    } else {
+        // 通常時は videoContainer に戻す
+        videoContainer.addEventListener('contextmenu', showContextMenu);
+        document.removeEventListener('contextmenu', showContextMenu);
+    }
+}
         
         // 右クリックメニューイベント
         videoContainer.addEventListener('contextmenu', showContextMenu);