90 Second Skip Button with Auto-hide

Adds a 90 second skip button to video players that hides when inactive

安裝腳本?
作者推薦腳本

您可能也會喜歡 Aniworld Next Episode Button (Fixed v2)

安裝腳本
  1. // ==UserScript==
  2. // @name 90 Second Skip Button with Auto-hide
  3. // @namespace http://tampermonkey.net/
  4. // @version 0.1
  5. // @description Adds a 90 second skip button to video players that hides when inactive
  6. // @author You
  7. // @match *://*/*
  8. // @exclude https://www.twitch.tv/*
  9. // @license MIT
  10. // @grant none
  11. // ==/UserScript==
  12.  
  13. (function() {
  14. 'use strict';
  15.  
  16. let timeout;
  17.  
  18. function showControls(buttonContainer) {
  19. buttonContainer.style.opacity = '1';
  20. }
  21.  
  22. function hideControls(buttonContainer) {
  23. buttonContainer.style.opacity = '0';
  24. }
  25.  
  26. // Function to create and add the skip button
  27. function addSkipButton(video) {
  28. // Create button container
  29. const buttonContainer = document.createElement('div');
  30. buttonContainer.style.cssText = `
  31. position: absolute;
  32. z-index: 9999;
  33. padding: 5px;
  34. background: rgba(0, 0, 0, 0.7);
  35. border-radius: 5px;
  36. bottom: 70px;
  37. right: 20px;
  38. opacity: 0;
  39. transition: opacity 0.3s ease;
  40. `;
  41.  
  42. // Create the skip button
  43. const skipButton = document.createElement('button');
  44. skipButton.innerHTML = 'Skip 80s';
  45. skipButton.style.cssText = `
  46. background: #040720;
  47. color: white;
  48. border: none;
  49. padding: 8px 15px;
  50. border-radius: 4px;
  51. cursor: pointer;
  52. font-size: 14px;
  53. `;
  54.  
  55. // Add click event
  56. skipButton.addEventListener('click', () => {
  57. video.currentTime += 80;
  58. });
  59.  
  60. // Add button to container
  61. buttonContainer.appendChild(skipButton);
  62.  
  63. // Add container next to video
  64. video.parentElement.style.position = 'relative';
  65. video.parentElement.appendChild(buttonContainer);
  66.  
  67. // Add mousemove event listener to video container
  68. video.parentElement.addEventListener('mousemove', () => {
  69. showControls(buttonContainer);
  70. clearTimeout(timeout);
  71. timeout = setTimeout(() => hideControls(buttonContainer), 2000); // Hide after 2 seconds of inactivity
  72. });
  73.  
  74. // Show controls initially when mouse enters video area
  75. video.parentElement.addEventListener('mouseenter', () => {
  76. showControls(buttonContainer);
  77. clearTimeout(timeout);
  78. timeout = setTimeout(() => hideControls(buttonContainer), 2000);
  79. });
  80.  
  81. // Hide controls when mouse leaves video area
  82. video.parentElement.addEventListener('mouseleave', () => {
  83. hideControls(buttonContainer);
  84. clearTimeout(timeout);
  85. });
  86. }
  87.  
  88. // Function to find and process video elements
  89. function findAndProcessVideos() {
  90. const videos = document.getElementsByTagName('video');
  91. for (let video of videos) {
  92. if (!video.dataset.skipButtonAdded) {
  93. addSkipButton(video);
  94. video.dataset.skipButtonAdded = 'true';
  95. }
  96. }
  97. }
  98.  
  99. // Initial check for videos
  100. findAndProcessVideos();
  101.  
  102. // Watch for new video elements being added
  103. const observer = new MutationObserver(findAndProcessVideos);
  104. observer.observe(document.body, {
  105. childList: true,
  106. subtree: true
  107. });
  108. })();