LinkedIn Learning 字幕大小调整

在 LinkedIn Learning 视频播放器设置菜单中添加字幕大小调整功能

  1. // ==UserScript==
  2. // @name LinkedIn Learning 字幕大小调整
  3. // @name:en LinkedIn Learning Subtitle Size Adjuster
  4. // @name:zh-CN LinkedIn Learning 字幕大小调整
  5. // @name:zh-TW LinkedIn Learning 字幕大小調整
  6. // @name:ja LinkedIn Learning 字幕サイズ調整
  7. // @name:ko LinkedIn Learning 자막 크기 조정
  8. // @name:es Ajustador de tamaño de subtítulos de LinkedIn Learning
  9. // @name:fr Ajusteur de taille des sous-titres LinkedIn Learning
  10. // @name:it Regolatore dimensione sottotitoli LinkedIn Learning
  11. // @name:de LinkedIn Learning Untertitelgrößen-Anpasser
  12. // @namespace http://tampermonkey.net/
  13. // @version 1.3
  14. // @description 在 LinkedIn Learning 视频播放器设置菜单中添加字幕大小调整功能
  15. // @description:en Add subtitle size adjustment to LinkedIn Learning video player settings
  16. // @description:zh-CN 在 LinkedIn Learning 视频播放器设置菜单中添加字幕大小调整功能
  17. // @description:zh-TW 在 LinkedIn Learning 視頻播放器設置菜單中添加字幕大小調整功能
  18. // @description:ja LinkedIn Learning のビデオプレーヤー設定に字幕サイズ調整機能を追加
  19. // @description:ko LinkedIn Learning 비디오 플레이어 설정에 자막 크기 조정 기능 추가
  20. // @description:es Agregar ajuste de tamaño de subtítulos en la configuración del reproductor de LinkedIn Learning
  21. // @description:fr Ajouter le réglage de la taille des sous-titres dans les paramètres du lecteur LinkedIn Learning
  22. // @description:it Aggiunge la regolazione della dimensione dei sottotitoli nelle impostazioni del player LinkedIn Learning
  23. // @description:de Fügt Untertitelgrößenanpassung zu den LinkedIn Learning Player-Einstellungen hinzu
  24. // @author 经本正一
  25. // @license MIT
  26. // @match https://www.linkedin.com/learning/*
  27. // @grant none
  28. // ==/UserScript==
  29.  
  30.  
  31. (function() {
  32. 'use strict';
  33.  
  34. // 创建字幕控制菜单项
  35. function createSubtitleControls() {
  36. const settingsMenu = document.querySelector('.vjs-settings-menu .vjs-menu-content');
  37. if (!settingsMenu) {
  38. console.log('未找到设置菜单');
  39. return;
  40. }
  41.  
  42. // 创建字幕控制容器
  43. const subtitleControlContainer = document.createElement('div');
  44. subtitleControlContainer.className = 'vjs-menu-item subtitle-size-control';
  45. subtitleControlContainer.style.cssText = `
  46. display: flex;
  47. align-items: center;
  48. justify-content: space-between;
  49. padding: 8px 16px;
  50. cursor: default;
  51. border-bottom: 1px solid rgba(255,255,255,0.1);
  52. color: white;
  53. font-family: -apple-system,system-ui,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue","Fira Sans",Ubuntu,Oxygen,"Oxygen Sans",Cantarell,"Droid Sans","Apple Color Emoji","Segoe UI Emoji","Segoe UI Emoji","Segoe UI Symbol","Lucida Grande",Helvetica,Arial,sans-serif;
  54. `;
  55.  
  56. // 添加标题
  57. const title = document.createElement('span');
  58. title.textContent = '字幕大小';
  59. title.style.marginRight = '10px';
  60.  
  61. // 创建按钮容器
  62. const buttonContainer = document.createElement('div');
  63. buttonContainer.style.display = 'flex';
  64. buttonContainer.style.gap = '5px';
  65.  
  66. // 按钮样式
  67. const buttonStyle = `
  68. padding: 2px 8px;
  69. margin: 0 2px;
  70. border: none;
  71. border-radius: 3px;
  72. background: #0a66c2;
  73. color: white;
  74. cursor: pointer;
  75. font-size: 12px;
  76. `;
  77.  
  78. // 创建按钮
  79. const decreaseBtn = document.createElement('button');
  80. decreaseBtn.textContent = '小';
  81. decreaseBtn.style.cssText = buttonStyle;
  82. const defaultBtn = document.createElement('button');
  83. defaultBtn.textContent = '默认';
  84. defaultBtn.style.cssText = buttonStyle;
  85. const increaseBtn = document.createElement('button');
  86. increaseBtn.textContent = '大';
  87. increaseBtn.style.cssText = buttonStyle;
  88.  
  89. // 添加事件监听
  90. decreaseBtn.addEventListener('click', (e) => {
  91. e.stopPropagation();
  92. adjustSubtitleSize(-0.1);
  93. });
  94. defaultBtn.addEventListener('click', (e) => {
  95. e.stopPropagation();
  96. resetSubtitleSize();
  97. });
  98. increaseBtn.addEventListener('click', (e) => {
  99. e.stopPropagation();
  100. adjustSubtitleSize(0.1);
  101. });
  102.  
  103. // 组装控件
  104. buttonContainer.appendChild(decreaseBtn);
  105. buttonContainer.appendChild(defaultBtn);
  106. buttonContainer.appendChild(increaseBtn);
  107. subtitleControlContainer.appendChild(title);
  108. subtitleControlContainer.appendChild(buttonContainer);
  109.  
  110. // 插入到设置菜单的最前面
  111. if (settingsMenu.firstChild) {
  112. settingsMenu.insertBefore(subtitleControlContainer, settingsMenu.firstChild);
  113. } else {
  114. settingsMenu.appendChild(subtitleControlContainer);
  115. }
  116. }
  117.  
  118. // 调整字幕大小
  119. function adjustSubtitleSize(delta) {
  120. const subtitles = document.querySelector('.vjs-text-track-display');
  121. if (!subtitles) {
  122. console.log('未找到字幕元素');
  123. return;
  124. }
  125.  
  126. const currentScale = parseFloat(subtitles.style.transform?.match(/scale\((.*?)\)/) ?.[1]) || 1;
  127. const newScale = Math.max(0.5, Math.min(2, currentScale + delta));
  128. subtitles.style.transform = `scale(${newScale})`;
  129. console.log(`字幕大小已调整为: ${newScale}`);
  130. }
  131.  
  132. // 重置字幕大小
  133. function resetSubtitleSize() {
  134. const subtitles = document.querySelector('.vjs-text-track-display');
  135. if (!subtitles) return;
  136. subtitles.style.transform = 'scale(1)';
  137. }
  138.  
  139. // 初始化
  140. function init() {
  141. console.log('正在初始化字幕控制...');
  142. // 监听齿轮按钮的点击事件
  143. document.addEventListener('click', (e) => {
  144. // 等待菜单出现
  145. setTimeout(() => {
  146. const settingsMenu = document.querySelector('.vjs-settings-menu .vjs-menu-content');
  147. const existingControls = document.querySelector('.subtitle-size-control');
  148. if (settingsMenu && !existingControls) {
  149. console.log('找到设置菜单,添加字幕控制');
  150. createSubtitleControls();
  151. }
  152. }, 100);
  153. });
  154. }
  155.  
  156. init();
  157. })();

QingJ © 2025

镜像随时可能失效,请加Q群300939539或关注我们的公众号极客氢云获取最新地址