{"id":7333,"date":"2025-02-27T15:56:48","date_gmt":"2025-02-27T06:56:48","guid":{"rendered":"https:\/\/mikeneko.cute.bz\/x\/wp\/?p=7333"},"modified":"2025-02-27T15:57:20","modified_gmt":"2025-02-27T06:57:20","slug":"cryptact-%e3%83%ac%e3%82%a4%e3%82%a2%e3%82%a6%e3%83%88%e3%80%80stylus-style-js%e3%80%80tampermonkey","status":"publish","type":"post","link":"https:\/\/mikeneko.cute.bz\/x\/wp\/2025\/02\/27\/cryptact-%e3%83%ac%e3%82%a4%e3%82%a2%e3%82%a6%e3%83%88%e3%80%80stylus-style-js%e3%80%80tampermonkey\/","title":{"rendered":"Cryptact \u30ec\u30a4\u30a2\u30a6\u30c8\u3000stylus style JS\u3000Tampermonkey"},"content":{"rendered":"
2025-02-27\u3000Cryptact\u306eWEB\u7248\u306e\u30ec\u30a4\u30a2\u30a6\u30c8\u3092\u5909\u66f4\u3002<\/h5>\n

 <\/p>\n

Cryptact\u8868\u793a\u7528\u3067\u30d6\u30e9\u30a6\u30b6\u3092\u5206\u3051\u308b\u304b\u3002Opera\u3067\u3082\u4f7f\u3046\u3053\u3068\u306b\u3057\u3088\u3046\u3002<\/p>\n

\u30ec\u30a4\u30a2\u30a6\u30c8\u3092\u5909\u3048\u308b\u304b\u3089\u306d\u3002<\/p>\n

Grok3\u3055\u3093\u3068\u76f8\u8ac7\u3057\u3066\u4f5c\u6210\u3002<\/p>\n

\u8981\u306f\u8868\u304c\u898b\u5207\u308c\u308b\u3002\u2192Stylus\u3067\u5909\u66f4\u3002<\/p>\n

\n
\r\n\r\n\/* \u30c6\u30fc\u30d6\u30eb\u306e\u5217\u5e45\u3092\u81ea\u52d5\u8abf\u6574\u3057\u3066\u898b\u5207\u308c\u306a\u3044\u3088\u3046\u306b\u3059\u308b *\/\r\ntable {\r\n  table-layout: auto !important;\r\n  word-wrap: break-word !important;\r\n  white-space: normal !important;\r\n}\r\n\r\n\/* \u30c6\u30ad\u30b9\u30c8\u3092\u6298\u308a\u8fd4\u3057\u3066\u8868\u793a\u3059\u308b *\/\r\ntd, th {\r\n  white-space: normal !important;\r\n  word-break: break-word !important;\r\n}\r\n\r\n\/* \u9577\u3044\u30c6\u30ad\u30b9\u30c8\u3092\u30b9\u30af\u30ed\u30fc\u30eb\u53ef\u80fd\u306b\u3059\u308b\u5834\u5408 *\/\r\ntd {\r\n  overflow-x: auto !important;\r\n  max-width: 200px; \/* \u5fc5\u8981\u306b\u5fdc\u3058\u3066\u8abf\u6574 *\/\r\n}\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n<\/code><\/pre>\n<\/div>\n
\u898b\u51fa\u3057\u304c\u898b\u3048\u306a\u304f\u306a\u3063\u3066\u4e0d\u4fbf\u3000\u2192\u3000Javascript\u3067\u5bfe\u5fdc\uff08Tampermonkey\uff09<\/p>\n
\n
\r\n\r\n\/\/ ==UserScript==\r\n\/\/ @name         Cryptact Fixed Header\r\n\/\/ @namespace    http:\/\/tampermonkey.net\/\r\n\/\/ @version      0.1\r\n\/\/ @description  Fix table header on scroll for Transactions page only\r\n\/\/ @author       You\r\n\/\/ @match        https:\/\/grid.cryptact.com\/*\r\n\/\/ @grant        none\r\n\/\/ ==\/UserScript==\r\n\r\n(function() {\r\n    'use strict';\r\n\r\n    function createFixedHeader() {\r\n        const currentUrl = location.href;\r\n        const isTransactionsPage = currentUrl.startsWith('https:\/\/grid.cryptact.com\/transactions\/');\r\n\r\n        \/\/ Transaction\u30da\u30fc\u30b8\u4ee5\u5916\u3067\u65e2\u5b58\u30d8\u30c3\u30c0\u30fc\u3092\u524a\u9664\r\n        if (!isTransactionsPage) {\r\n            const existingHeader = document.querySelector('.fixed-header');\r\n            if (existingHeader) {\r\n                existingHeader.remove();\r\n                console.log('Removed fixed header on non-Transactions page:', currentUrl);\r\n            }\r\n            return;\r\n        }\r\n\r\n        const table = document.querySelector('.table--hoverable');\r\n        if (!table) {\r\n            console.log('Error: .table--hoverable not found');\r\n            return;\r\n        }\r\n        const thead = table.querySelector('thead tr');\r\n        if (!thead) {\r\n            console.log('Error: thead tr not found within .table--hoverable');\r\n            return;\r\n        }\r\n        console.log('Found thead! Creating fixed header on Transactions page.');\r\n\r\n        const existingHeader = document.querySelector('.fixed-header');\r\n        if (existingHeader) existingHeader.remove();\r\n\r\n        const fixedHeader = thead.cloneNode(true);\r\n        fixedHeader.className = 'fixed-header';\r\n        fixedHeader.style.position = 'fixed';\r\n        fixedHeader.style.top = '140px';\r\n        fixedHeader.style.backgroundColor = '#f0f0f0';\r\n        fixedHeader.style.zIndex = '10';\r\n        const tableRect = table.getBoundingClientRect();\r\n        fixedHeader.style.left = tableRect.left + 'px';\r\n        fixedHeader.style.width = tableRect.width + 'px';\r\n        document.body.appendChild(fixedHeader);\r\n\r\n        fixedHeader.style.display = 'none';\r\n\r\n        function syncWidths() {\r\n            const ths = thead.querySelectorAll('th');\r\n            const fixedThs = fixedHeader.querySelectorAll('th');\r\n            const tbodyRows = table.querySelectorAll('tbody tr');\r\n            const tds = tbodyRows[0] ? tbodyRows[0].querySelectorAll('td') : [];\r\n            fixedThs.forEach((th, index) => {\r\n                if (tds[index]) th.style.width = getComputedStyle(tds[index]).width;\r\n            });\r\n            fixedHeader.style.left = table.getBoundingClientRect().left + 'px';\r\n            fixedHeader.style.width = table.getBoundingClientRect().width + 'px';\r\n        }\r\n\r\n        syncWidths();\r\n        window.addEventListener('resize', syncWidths);\r\n        window.addEventListener('scroll', () => {\r\n            const scrollTop = window.pageYOffset || document.documentElement.scrollTop;\r\n            fixedHeader.style.display = scrollTop > 200 ? 'table-row' : 'none';\r\n            syncWidths();\r\n        });\r\n    }\r\n\r\n    \/\/ \u521d\u56de\u5b9f\u884c\u3068\u30da\u30fc\u30b8\u5909\u66f4\u691c\u77e5\r\n    setTimeout(() => {\r\n        createFixedHeader();\r\n    }, 5000); \/\/ 5\u79d2\u5f85\u6a5f\r\n\r\n    let lastUrl = location.href;\r\n    setInterval(() => {\r\n        if (lastUrl !== location.href) {\r\n            lastUrl = location.href;\r\n            setTimeout(() => {\r\n                createFixedHeader();\r\n            }, 5000); \/\/ 5\u79d2\u5f85\u6a5f\r\n            console.log('URL changed, recreated fixed header.');\r\n        }\r\n    }, 500); \/\/ 0.5\u79d2\u3054\u3068\u306bURL\u30c1\u30a7\u30c3\u30af\r\n})();\r\n<\/code><\/pre>\n<\/div>\n","protected":false},"excerpt":{"rendered":"
2025-02-27\u3000Cryptact\u306eWEB\u7248\u306e\u30ec\u30a4\u30a2\u30a6\u30c8\u3092\u5909\u66f4\u3002   Cryptact\u8868\u793a\u7528\u3067\u30d6\u30e9\u30a6\u30b6\u3092\u5206\u3051\u308b\u304b\u3002Opera\u3067\u3082\u4f7f\u3046\u3053\u3068\u306b\u3057\u3088\u3046\u3002 \u30ec\u30a4\u30a2\u30a6\u30c8\u3092\u5909\u3048\u308b\u304b\u3089\u306d\u3002 Grok3\u3055\u3093\u3068\u76f8\u8ac7\u3057\u3066\u4f5c\u6210\u3002 … <\/p>\n
“Cryptact \u30ec\u30a4\u30a2\u30a6\u30c8\u3000stylus style JS\u3000Tampermonkey” \u306e<\/span>\u7d9a\u304d\u3092\u8aad\u3080<\/a><\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":[],"categories":[1],"tags":[],"jetpack_featured_media_url":"","_links":{"self":[{"href":"https:\/\/mikeneko.cute.bz\/x\/wp\/wp-json\/wp\/v2\/posts\/7333"}],"collection":[{"href":"https:\/\/mikeneko.cute.bz\/x\/wp\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/mikeneko.cute.bz\/x\/wp\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/mikeneko.cute.bz\/x\/wp\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/mikeneko.cute.bz\/x\/wp\/wp-json\/wp\/v2\/comments?post=7333"}],"version-history":[{"count":2,"href":"https:\/\/mikeneko.cute.bz\/x\/wp\/wp-json\/wp\/v2\/posts\/7333\/revisions"}],"predecessor-version":[{"id":7335,"href":"https:\/\/mikeneko.cute.bz\/x\/wp\/wp-json\/wp\/v2\/posts\/7333\/revisions\/7335"}],"wp:attachment":[{"href":"https:\/\/mikeneko.cute.bz\/x\/wp\/wp-json\/wp\/v2\/media?parent=7333"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/mikeneko.cute.bz\/x\/wp\/wp-json\/wp\/v2\/categories?post=7333"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/mikeneko.cute.bz\/x\/wp\/wp-json\/wp\/v2\/tags?post=7333"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}