Button Go to the Top of Response on ChatGPT.com

Adds a button that scrolls to the top of each response on ChatGPT.com

当前为 2024-11-23 提交的版本,查看 最新版本

  1. // ==UserScript==
  2. // @name Button Go to the Top of Response on ChatGPT.com
  3. // @namespace http://tampermonkey.net/
  4. // @version 1.3.2
  5. // @description Adds a button that scrolls to the top of each response on ChatGPT.com
  6. // @author
  7. // @match http://*.chatgpt.com/*
  8. // @match https://*.chatgpt.com/*
  9. // @grant none
  10. // @license MIT
  11. // ==/UserScript==
  12.  
  13. (function() {
  14. 'use strict';
  15.  
  16.  
  17. function addButtons() {
  18. const responses = document.querySelectorAll('article[data-testid^="conversation-turn-"] > div');
  19.  
  20. responses.forEach((response, index) => {
  21. if (response.querySelector('.go-to-top-button')) {
  22. return;
  23. }
  24.  
  25. const button = document.createElement('button');
  26. button.textContent = '^';
  27. button.className = 'go-to-top-button';
  28. button.style.position = 'absolute';
  29. button.style.top = '10px';
  30. button.style.right = '28px';
  31. button.style.zIndex = '1000';
  32. button.style.padding = '8px 12px';
  33. button.style.backgroundColor = '#808080';
  34. button.style.color = '#fff';
  35. button.style.border = 'none';
  36. button.style.cursor = 'pointer';
  37.  
  38. button.addEventListener('click', () => {
  39. response.scrollIntoView({ behavior: 'smooth', block: 'start' });
  40. });
  41.  
  42. response.style.position = 'relative';
  43. response.appendChild(button);
  44. });
  45.  
  46. // Make only the last button fixed
  47. const lastButton = responses[responses.length - 1]?.querySelector('.go-to-top-button');
  48. if (lastButton) {
  49. lastButton.style.position = 'fixed';
  50. }
  51. }
  52.  
  53. function start() {
  54. addButtons();
  55. }
  56.  
  57. const observer = new MutationObserver(() => {
  58. start();
  59. // Set position of specific element to absolute
  60. const targetElement = document.querySelector("body > div.relative.flex.h-full.w-full.overflow-hidden.transition-colors.z-0 > div.relative.flex.h-full.max-w-full.flex-1.flex-col.overflow-hidden > main > div.composer-parent.flex.h-full.flex-col.focus-visible\\:outline-0 > div.flex-1.overflow-hidden > div > div > div > div > div")
  61. if (targetElement) {
  62. targetElement.style.position = 'absolute';
  63. }
  64. });
  65.  
  66. observer.observe(document.body, { childList: true, subtree: true });
  67.  
  68. start();
  69. })();