Hover-Display Button to Open Steam Page in Client

在Steam页面左上角添加悬停显示的按钮,点击在Steam客户端打开当前页面

  1. // ==UserScript==
  2. // @name Hover-Display Button to Open Steam Page in Client
  3. // @namespace http://tampermonkey.net/
  4. // @version 0.2
  5. // @description 在Steam页面左上角添加悬停显示的按钮,点击在Steam客户端打开当前页面
  6. // @author SynEvo
  7. // @match https://store.steampowered.com/*
  8. // @match https://steamcommunity.com/*
  9. // @grant none
  10. // @license MIT
  11. // ==/UserScript==
  12.  
  13. (function() {
  14. 'use strict';
  15.  
  16. // 创建按钮元素
  17. const button = document.createElement('button');
  18. button.style.position = 'fixed';
  19. button.style.top = '10px';
  20. button.style.left = '10px';
  21. button.style.zIndex = '9999';
  22. button.style.opacity = '0';
  23. button.style.transition = 'opacity 0.3s';
  24. button.style.padding = '5px 10px';
  25. button.style.backgroundColor = '#171d25';
  26. button.style.color = '#ffffff';
  27. button.style.border = 'none';
  28. button.style.borderRadius = '3px';
  29. button.style.cursor = 'pointer';
  30. button.style.display = 'flex';
  31. button.style.alignItems = 'center';
  32.  
  33. // 创建图标元素
  34. const icon = document.createElement('img');
  35. icon.src = 'https://store.steampowered.com/favicon.ico';
  36. icon.style.width = '16px';
  37. icon.style.height = '16px';
  38. icon.style.marginRight = '5px';
  39.  
  40. // 创建文字节点
  41. const text = document.createTextNode('在Steam中打开');
  42.  
  43. // 将图标和文字添加到按钮
  44. button.appendChild(icon);
  45. button.appendChild(text);
  46.  
  47. // 添加到页面
  48. document.body.appendChild(button);
  49.  
  50. // 获取当前页面URL并转换为Steam协议链接
  51. function getSteamProtocolUrl() {
  52. const currentUrl = window.location.href;
  53. return 'steam://openurl/' + currentUrl;
  54. }
  55.  
  56. // 鼠标悬停显示/隐藏
  57. const hoverArea = document.createElement('div');
  58. hoverArea.style.position = 'fixed';
  59. hoverArea.style.top = '0';
  60. hoverArea.style.left = '0';
  61. hoverArea.style.width = '50px';
  62. hoverArea.style.height = '50px';
  63. hoverArea.style.zIndex = '9998';
  64.  
  65. document.body.appendChild(hoverArea);
  66.  
  67. hoverArea.addEventListener('mouseenter', () => {
  68. button.style.opacity = '1';
  69. });
  70.  
  71. hoverArea.addEventListener('mouseleave', () => {
  72. button.style.opacity = '0';
  73. });
  74.  
  75. // 点击事件
  76. button.addEventListener('click', () => {
  77. window.location.href = getSteamProtocolUrl();
  78. });
  79.  
  80. // 按钮自身的悬停保持显示
  81. button.addEventListener('mouseenter', () => {
  82. button.style.opacity = '1';
  83. });
  84.  
  85. button.addEventListener('mouseleave', () => {
  86. button.style.opacity = '0';
  87. });
  88. })();

QingJ © 2025

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