Adds a button that scrolls to the top of each response on ChatGPT.com
// ==UserScript==
// @name Button Go to the Top of Response on ChatGPT.com
// @namespace http://tampermonkey.net/
// @version 1.3.2
// @description Adds a button that scrolls to the top of each response on ChatGPT.com
// @author
// @match http://*.chatgpt.com/*
// @match https://*.chatgpt.com/*
// @grant none
// @license MIT
// ==/UserScript==
(function() {
'use strict';
function addButtons() {
const responses = document.querySelectorAll('article[data-testid^="conversation-turn-"] > div');
responses.forEach((response, index) => {
if (response.querySelector('.go-to-top-button')) {
return;
}
const button = document.createElement('button');
button.textContent = '^';
button.className = 'go-to-top-button';
button.style.position = 'absolute';
button.style.bottom = '10px';
button.style.right = '10px';
button.style.zIndex = '1000';
button.style.padding = '8px 12px';
button.style.backgroundColor = '#808080';
button.style.color = '#fff';
button.style.border = 'none';
button.style.cursor = 'pointer';
button.addEventListener('click', () => {
response.scrollIntoView({ behavior: 'smooth', block: 'start' });
});
response.style.position = 'relative';
response.appendChild(button);
});
// Make only the last button fixed
const lastButton = responses[responses.length - 1]?.querySelector('.go-to-top-button');
if (lastButton) {
lastButton.style.position = 'fixed';
lastButton.textContent = 'last answer ↑';
lastButton.style.top = '6px';
lastButton.style.top = '8px';
lastButton.style.right = '27px';
lastButton.style.backgroundColor = '#000000';
lastButton.style.height = '40px';
}
}
function start() {
addButtons();
}
const observer = new MutationObserver(() => {
start();
// Set position of specific element to absolute
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")
if (targetElement) {
targetElement.style.position = 'absolute';
}
});
observer.observe(document.body, { childList: true, subtree: true });
start();
})();