4 ms·

My slight modification on this is: data:text/html,<html><head><title>Notepad</title><style>html,body{margin:0;padding:0;}textarea{padding:10px;font-family:

by maxmcd 3y ago

My slight modification on this is: data:text/html,<html><head><title>Notepad</title><style>html,body{margin:0;padding:0;}textarea{padding:10px;font-family:Courier;font-size:16px;height:100%;width:100%;border:none;outline:none;}</style></head><body><textarea style="height:100%;width:100%;font-size:16px;padding:10px;"></textarea><script>document.getElementsByTagName('textarea')[0].focus()</script></body></html>

nbbaier 3y ago
This is great! Is there a way to persist the state across refreshes?
dannyphantom 3y ago
I love, love, love threads like this where people share their bookmarklets. It's how I found kill-sticky[1] which I use religiously. javascript:(function()%7Bdocument.querySelectorAll(%22body%20%22).forEach(function(node)%7Bif(%5B%22fixed%22%2C%22sticky%22%5D.includes(getComputedStyle(node).position))%7Bnode.parentNode.removeChild(node)%7D%7D)%3Bdocument.querySelectorAll(%22html%20%22).forEach(function(node)%7Bvar%20s%3DgetComputedStyle(node)%3Bif(%22hidden%22%3D%3D%3Ds%5B%22overflow%22%5D)%7Bnode.style%5B%22overflow%22%5D%3D%22visible%22%7Dif(%22hidden%22%3D%3D%3Ds%5B%22overflow-x%22%5D)%7Bnode.style%5B%22overflow-x%22%5D%3D%22visible%22%7Dif(%22hidden%22%3D%3D%3Ds%5B%22overflow-y%22%5D)%7Bnode.style%5B%22overflow-y%22%5D%3D%22visible%22%7D%7D)%3Bvar%20htmlNode%3Ddocument.querySelector(%22html%22)%3BhtmlNode.style%5B%22overflow%22%5D%3D%22visible%22%3BhtmlNode.style%5B%22overflow-x%22%5D%3D%22visible%22%3BhtmlNode.style%5B%22overflow-y%22%5D%3D%22visible%22%7D)()%3B%0A [1] https://hn.algolia.com/?dateRange=all&page=0&prefix=true&query=kill-sticky&sort=byDate&type=comment https://hn.algolia.com/?dateRange=all&page=0&prefix=true&que...
- hattmall 3y ago
  Wat do?
  - celadin 3y ago
    It kills dickbars (aka sticky hover-over UI elements on websites), which term was coined by Mr Gruber of Daring Fireball fame. https://daringfireball.net/linked/2017/06/27/mcdiarmid-sticky-headers https://daringfireball.net/linked/2017/06/27/mcdiarmid-stick...
- sublinear 3y ago
  Haha this is funny. Does this even work for pages that are written with frontend frameworks? Needs a remix for 2024. Virtual DOM refreshes might bring back the original style if not the elements themselves. As insane as it sounds what probably makes more sense is to query for and remove the elements, generate a PNG of the page, delete everything in the body, and make sure the only child element of the body tag is your new img tag. Also since you cannot unload or make undefined all the other js already running you may want to add some defensive event handlers on the body tag with MutationObserver. https://developer.mozilla.org/en-US/docs/Web/API/MutationObserver https://developer.mozilla.org/en-US/docs/Web/API/MutationObs...
- hagbard_c 3y ago
  If you have uBlock Origin - and who doesn't - you can use the 'element zapper' to do targeted killing of such annoying elements. It does wonders for those sticky headers, grey-out overlays and similar nuisances. Bind it to a key - I use CTRL-ALT-Z for 'zap' - and you don't need to leave the keyboard to go on a killing spree.
consumer451 3y ago
Thanks for this! Here is my modification to yours. I added a data URI notepad favicon. data:text/html,<html><head><link rel="icon" type="image/png" sizes="32x32" href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAERElEQVRYR+1XbUxbVRh+zm2hX7TlY4LOGF1GOnQuTv0x5twPdS5qlABlOHXJmNn8o+6Hy2ayKGMwkyWO+MsYt2Rios6MTo2bSoQNIpFgYYv7YMXxIRTaCrTQ0rLStdzje++kUtdAa5uYJZ6kufe8vc/7PPe873nfcxnijF1v1ZiYAoc4+CoG1q5QzL4bVKuDGQGxmjH2LANGRVGsPVZf17VzT00FE8TdjCOTXH1y9Ejtx/HwHx0+PBWPi3zFjp379xcIkcyLEMV8MDZB/+ZzoJMInGAop7kbnOeACbPg4vtkO0C2WYCF6WoAeD1dt4EjBt+nYxvbamoi/+S7RcCuvQfqyPgO5+KeY0fqPqD5cZpXyUCGn+BdvgkGx2YSd+amiQXFOawVOdwKJX4lAfdIds4Z4Wv+xotzZUfrD32zpIDX9lZ/S25fMJeWHMzLzp62O50PXr7Ss93hdAkmk+n0Y8Xr2hmxWq3dtT02m8qg1w+Xl5V+KDm29fZWku3RgD/AyktK3jNkG31DDldRx7Xx7V5m/DxU8Mjuxspc30IRMStwwTa0vuns2TNDw/bc55/ZjOV33Sk/ax8ZRVPLOawuWoUN69fJNs45Gj47gUxVJraay6BQKGR7W/vPuNY/gIX4OYphs0uLi17VBOFKLVvyOuZFRAW0tv6u1hfM9dtHHHdLZAK9ppKHUbXjVYQjEZxo/AqhUAihwDRerNyCO/Lzo2RiJIw195uw4fGNsI+S2OZYvERGIcLxQQM8IYVD5/cVNuxYQXkjhfCvYe0ZeEpgaJGmnV3duHSlB6NDg3h73z7odDo4XC782NIKv38aa4oK8cSTmzBLgr5raoZnchLhGR9ef+NN2Vs8vGRvH9egw62m9BGfPmleJnNFBXT1DlYwkTfOL6+l8SQEUmSuqIyG7ML587D+0omXX9kGg9Eo2z1uNyyWRhQXF+OhtQ9HwxMP3+VR4dyYVgpfJYVB5oorIMqY5pv/Bdw+KzATDGLK66dqSnsnxZGl1SLHqJe9JLwCw84/4J70pkh9E65Rq/BA4YrkBFCnw/XZUFoEqDIzkKFUJicgLcxxnCQcAqnOS+U3HUNJLVIqaEnlwIhrDOOeuOeHpDXpNGoUrbwvOQHTgRk5CVPfA4Bep0V+Xk5yApJ+zQQBCedAgv6SfixhAXIIpqgOpCEGWf8mBP95EqZ3GypoGwq3WRJKpThIpTjRFNDQwXT+ULpYZiachHZqRhNJNCOjXofCe+XPgUVHwgJmrlM79iXejo36LBiydEvxL96OrbaBcoHj1JJeUnjA6lGjdUwDEbziVEWezBU9lHZc+q1IlaG8Sn3ols+1FDhjoN87tbjsU/FIWFz99dZlthgB0qT76sAXdHkpXYQL/XhCAhrowyQM9qXFnBvliHnbvr4+lS8sHCRgFf0K0iHkhsjQ71eibVw7Nn1D+HRGl1P9w3Msetr5Exxr3z9q3s3kAAAAAElFTkSuQmCC"><title>Notepad</title><style>html,body{margin:0;padding:0;}textarea{padding:10px;font-family:Courier;font-size:16px;height:100%;width:100%;border:none;outline:none;}</style></head><body><textarea style="height:100%;width:100%;font-size:16px;padding:10px;"></textarea><script>document.getElementsByTagName('textarea')[0].focus()</script></body></html>
qhungg289 3y ago
Add my own little twist to use the default Monospace font and change color scheme based on system theme: data:text/html,<html><head><link rel="icon" type="image/png" sizes="32x32" href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAERElEQVRYR+1XbUxbVRh+zm2hX7TlY4LOGF1GOnQuTv0x5twPdS5qlABlOHXJmNn8o+6Hy2ayKGMwkyWO+MsYt2Rios6MTo2bSoQNIpFgYYv7YMXxIRTaCrTQ0rLStdzje++kUtdAa5uYJZ6kufe8vc/7PPe873nfcxnijF1v1ZiYAoc4+CoG1q5QzL4bVKuDGQGxmjH2LANGRVGsPVZf17VzT00FE8TdjCOTXH1y9Ejtx/HwHx0+PBWPi3zFjp379xcIkcyLEMV8MDZB/+ZzoJMInGAop7kbnOeACbPg4vtkO0C2WYCF6WoAeD1dt4EjBt+nYxvbamoi/+S7RcCuvQfqyPgO5+KeY0fqPqD5cZpXyUCGn+BdvgkGx2YSd+amiQXFOawVOdwKJX4lAfdIds4Z4Wv+xotzZUfrD32zpIDX9lZ/S25fMJeWHMzLzp62O50PXr7Ss93hdAkmk+n0Y8Xr2hmxWq3dtT02m8qg1w+Xl5V+KDm29fZWku3RgD/AyktK3jNkG31DDldRx7Xx7V5m/DxU8Mjuxspc30IRMStwwTa0vuns2TNDw/bc55/ZjOV33Sk/ax8ZRVPLOawuWoUN69fJNs45Gj47gUxVJraay6BQKGR7W/vPuNY/gIX4OYphs0uLi17VBOFKLVvyOuZFRAW0tv6u1hfM9dtHHHdLZAK9ppKHUbXjVYQjEZxo/AqhUAihwDRerNyCO/Lzo2RiJIw195uw4fGNsI+S2OZYvERGIcLxQQM8IYVD5/cVNuxYQXkjhfCvYe0ZeEpgaJGmnV3duHSlB6NDg3h73z7odDo4XC782NIKv38aa4oK8cSTmzBLgr5raoZnchLhGR9ef+NN2Vs8vGRvH9egw62m9BGfPmleJnNFBXT1DlYwkTfOL6+l8SQEUmSuqIyG7ML587D+0omXX9kGg9Eo2z1uNyyWRhQXF+OhtQ9HwxMP3+VR4dyYVgpfJYVB5oorIMqY5pv/Bdw+KzATDGLK66dqSnsnxZGl1SLHqJe9JLwCw84/4J70pkh9E65Rq/BA4YrkBFCnw/XZUFoEqDIzkKFUJicgLcxxnCQcAqnOS+U3HUNJLVIqaEnlwIhrDOOeuOeHpDXpNGoUrbwvOQHTgRk5CVPfA4Bep0V+Xk5yApJ+zQQBCedAgv6SfixhAXIIpqgOpCEGWf8mBP95EqZ3GypoGwq3WRJKpThIpTjRFNDQwXT+ULpYZiachHZqRhNJNCOjXofCe+XPgUVHwgJmrlM79iXejo36LBiydEvxL96OrbaBcoHj1JJeUnjA6lGjdUwDEbziVEWezBU9lHZc+q1IlaG8Sn3ols+1FDhjoN87tbjsU/FIWFz99dZlthgB0qT76sAXdHkpXYQL/XhCAhrowyQM9qXFnBvliHnbvr4+lS8sHCRgFf0K0iHkhsjQ71eibVw7Nn1D+HRGl1P9w3Msetr5Exxr3z9q3s3kAAAAAElFTkSuQmCC"><title>Notepad</title><style>html,body{margin:0;padding:0;color-scheme:light dark;}textarea{padding:10px;font-family:Monospace;font-size:16px;height:100%;width:100%;border:none;outline:none;resize:none;}</style></head><body><textarea style="height:100%;width:100%;font-size:16px;padding:10px;"></textarea><script>document.getElementsByTagName('textarea')[0].focus()</script></body></html>

by maxmcd 3y ago

nbbaier 3y ago

This is great! Is there a way to persist the state across refreshes?

dannyphantom 3y ago

I love, love, love threads like this where people share their bookmarklets. It's how I found kill-sticky[1] which I use religiously. javascript:(function()%7Bdocument.querySelectorAll(%22body%20%22).forEach(function(node)%7Bif(%5B%22fixed%22%2C%22sticky%22%5D.includes(getComputedStyle(node).position))%7Bnode.parentNode.removeChild(node)%7D%7D)%3Bdocument.querySelectorAll(%22html%20%22).forEach(function(node)%7Bvar%20s%3DgetComputedStyle(node)%3Bif(%22hidden%22%3D%3D%3Ds%5B%22overflow%22%5D)%7Bnode.style%5B%22overflow%22%5D%3D%22visible%22%7Dif(%22hidden%22%3D%3D%3Ds%5B%22overflow-x%22%5D)%7Bnode.style%5B%22overflow-x%22%5D%3D%22visible%22%7Dif(%22hidden%22%3D%3D%3Ds%5B%22overflow-y%22%5D)%7Bnode.style%5B%22overflow-y%22%5D%3D%22visible%22%7D%7D)%3Bvar%20htmlNode%3Ddocument.querySelector(%22html%22)%3BhtmlNode.style%5B%22overflow%22%5D%3D%22visible%22%3BhtmlNode.style%5B%22overflow-x%22%5D%3D%22visible%22%3BhtmlNode.style%5B%22overflow-y%22%5D%3D%22visible%22%7D)()%3B%0A [1] https://hn.algolia.com/?dateRange=all&page=0&prefix=true&query=kill-sticky&sort=byDate&type=comment https://hn.algolia.com/?dateRange=all&page=0&prefix=true&que...

hattmall 3y ago
Wat do?
- celadin 3y ago
  It kills dickbars (aka sticky hover-over UI elements on websites), which term was coined by Mr Gruber of Daring Fireball fame. https://daringfireball.net/linked/2017/06/27/mcdiarmid-sticky-headers https://daringfireball.net/linked/2017/06/27/mcdiarmid-stick...
sublinear 3y ago
Haha this is funny. Does this even work for pages that are written with frontend frameworks? Needs a remix for 2024. Virtual DOM refreshes might bring back the original style if not the elements themselves. As insane as it sounds what probably makes more sense is to query for and remove the elements, generate a PNG of the page, delete everything in the body, and make sure the only child element of the body tag is your new img tag. Also since you cannot unload or make undefined all the other js already running you may want to add some defensive event handlers on the body tag with MutationObserver. https://developer.mozilla.org/en-US/docs/Web/API/MutationObserver https://developer.mozilla.org/en-US/docs/Web/API/MutationObs...
hagbard_c 3y ago
If you have uBlock Origin - and who doesn't - you can use the 'element zapper' to do targeted killing of such annoying elements. It does wonders for those sticky headers, grey-out overlays and similar nuisances. Bind it to a key - I use CTRL-ALT-Z for 'zap' - and you don't need to leave the keyboard to go on a killing spree.

consumer451 3y ago

Thanks for this! Here is my modification to yours. I added a data URI notepad favicon. data:text/html,<html><head><link rel="icon" type="image/png" sizes="32x32" href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAERElEQVRYR+1XbUxbVRh+zm2hX7TlY4LOGF1GOnQuTv0x5twPdS5qlABlOHXJmNn8o+6Hy2ayKGMwkyWO+MsYt2Rios6MTo2bSoQNIpFgYYv7YMXxIRTaCrTQ0rLStdzje++kUtdAa5uYJZ6kufe8vc/7PPe873nfcxnijF1v1ZiYAoc4+CoG1q5QzL4bVKuDGQGxmjH2LANGRVGsPVZf17VzT00FE8TdjCOTXH1y9Ejtx/HwHx0+PBWPi3zFjp379xcIkcyLEMV8MDZB/+ZzoJMInGAop7kbnOeACbPg4vtkO0C2WYCF6WoAeD1dt4EjBt+nYxvbamoi/+S7RcCuvQfqyPgO5+KeY0fqPqD5cZpXyUCGn+BdvgkGx2YSd+amiQXFOawVOdwKJX4lAfdIds4Z4Wv+xotzZUfrD32zpIDX9lZ/S25fMJeWHMzLzp62O50PXr7Ss93hdAkmk+n0Y8Xr2hmxWq3dtT02m8qg1w+Xl5V+KDm29fZWku3RgD/AyktK3jNkG31DDldRx7Xx7V5m/DxU8Mjuxspc30IRMStwwTa0vuns2TNDw/bc55/ZjOV33Sk/ax8ZRVPLOawuWoUN69fJNs45Gj47gUxVJraay6BQKGR7W/vPuNY/gIX4OYphs0uLi17VBOFKLVvyOuZFRAW0tv6u1hfM9dtHHHdLZAK9ppKHUbXjVYQjEZxo/AqhUAihwDRerNyCO/Lzo2RiJIw195uw4fGNsI+S2OZYvERGIcLxQQM8IYVD5/cVNuxYQXkjhfCvYe0ZeEpgaJGmnV3duHSlB6NDg3h73z7odDo4XC782NIKv38aa4oK8cSTmzBLgr5raoZnchLhGR9ef+NN2Vs8vGRvH9egw62m9BGfPmleJnNFBXT1DlYwkTfOL6+l8SQEUmSuqIyG7ML587D+0omXX9kGg9Eo2z1uNyyWRhQXF+OhtQ9HwxMP3+VR4dyYVgpfJYVB5oorIMqY5pv/Bdw+KzATDGLK66dqSnsnxZGl1SLHqJe9JLwCw84/4J70pkh9E65Rq/BA4YrkBFCnw/XZUFoEqDIzkKFUJicgLcxxnCQcAqnOS+U3HUNJLVIqaEnlwIhrDOOeuOeHpDXpNGoUrbwvOQHTgRk5CVPfA4Bep0V+Xk5yApJ+zQQBCedAgv6SfixhAXIIpqgOpCEGWf8mBP95EqZ3GypoGwq3WRJKpThIpTjRFNDQwXT+ULpYZiachHZqRhNJNCOjXofCe+XPgUVHwgJmrlM79iXejo36LBiydEvxL96OrbaBcoHj1JJeUnjA6lGjdUwDEbziVEWezBU9lHZc+q1IlaG8Sn3ols+1FDhjoN87tbjsU/FIWFz99dZlthgB0qT76sAXdHkpXYQL/XhCAhrowyQM9qXFnBvliHnbvr4+lS8sHCRgFf0K0iHkhsjQ71eibVw7Nn1D+HRGl1P9w3Msetr5Exxr3z9q3s3kAAAAAElFTkSuQmCC"><title>Notepad</title><style>html,body{margin:0;padding:0;}textarea{padding:10px;font-family:Courier;font-size:16px;height:100%;width:100%;border:none;outline:none;}</style></head><body><textarea style="height:100%;width:100%;font-size:16px;padding:10px;"></textarea><script>document.getElementsByTagName('textarea')[0].focus()</script></body></html>

qhungg289 3y ago

Add my own little twist to use the default Monospace font and change color scheme based on system theme: data:text/html,<html><head><link rel="icon" type="image/png" sizes="32x32" href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAERElEQVRYR+1XbUxbVRh+zm2hX7TlY4LOGF1GOnQuTv0x5twPdS5qlABlOHXJmNn8o+6Hy2ayKGMwkyWO+MsYt2Rios6MTo2bSoQNIpFgYYv7YMXxIRTaCrTQ0rLStdzje++kUtdAa5uYJZ6kufe8vc/7PPe873nfcxnijF1v1ZiYAoc4+CoG1q5QzL4bVKuDGQGxmjH2LANGRVGsPVZf17VzT00FE8TdjCOTXH1y9Ejtx/HwHx0+PBWPi3zFjp379xcIkcyLEMV8MDZB/+ZzoJMInGAop7kbnOeACbPg4vtkO0C2WYCF6WoAeD1dt4EjBt+nYxvbamoi/+S7RcCuvQfqyPgO5+KeY0fqPqD5cZpXyUCGn+BdvgkGx2YSd+amiQXFOawVOdwKJX4lAfdIds4Z4Wv+xotzZUfrD32zpIDX9lZ/S25fMJeWHMzLzp62O50PXr7Ss93hdAkmk+n0Y8Xr2hmxWq3dtT02m8qg1w+Xl5V+KDm29fZWku3RgD/AyktK3jNkG31DDldRx7Xx7V5m/DxU8Mjuxspc30IRMStwwTa0vuns2TNDw/bc55/ZjOV33Sk/ax8ZRVPLOawuWoUN69fJNs45Gj47gUxVJraay6BQKGR7W/vPuNY/gIX4OYphs0uLi17VBOFKLVvyOuZFRAW0tv6u1hfM9dtHHHdLZAK9ppKHUbXjVYQjEZxo/AqhUAihwDRerNyCO/Lzo2RiJIw195uw4fGNsI+S2OZYvERGIcLxQQM8IYVD5/cVNuxYQXkjhfCvYe0ZeEpgaJGmnV3duHSlB6NDg3h73z7odDo4XC782NIKv38aa4oK8cSTmzBLgr5raoZnchLhGR9ef+NN2Vs8vGRvH9egw62m9BGfPmleJnNFBXT1DlYwkTfOL6+l8SQEUmSuqIyG7ML587D+0omXX9kGg9Eo2z1uNyyWRhQXF+OhtQ9HwxMP3+VR4dyYVgpfJYVB5oorIMqY5pv/Bdw+KzATDGLK66dqSnsnxZGl1SLHqJe9JLwCw84/4J70pkh9E65Rq/BA4YrkBFCnw/XZUFoEqDIzkKFUJicgLcxxnCQcAqnOS+U3HUNJLVIqaEnlwIhrDOOeuOeHpDXpNGoUrbwvOQHTgRk5CVPfA4Bep0V+Xk5yApJ+zQQBCedAgv6SfixhAXIIpqgOpCEGWf8mBP95EqZ3GypoGwq3WRJKpThIpTjRFNDQwXT+ULpYZiachHZqRhNJNCOjXofCe+XPgUVHwgJmrlM79iXejo36LBiydEvxL96OrbaBcoHj1JJeUnjA6lGjdUwDEbziVEWezBU9lHZc+q1IlaG8Sn3ols+1FDhjoN87tbjsU/FIWFz99dZlthgB0qT76sAXdHkpXYQL/XhCAhrowyQM9qXFnBvliHnbvr4+lS8sHCRgFf0K0iHkhsjQ71eibVw7Nn1D+HRGl1P9w3Msetr5Exxr3z9q3s3kAAAAAElFTkSuQmCC"><title>Notepad</title><style>html,body{margin:0;padding:0;color-scheme:light dark;}textarea{padding:10px;font-family:Monospace;font-size:16px;height:100%;width:100%;border:none;outline:none;resize:none;}</style></head><body><textarea style="height:100%;width:100%;font-size:16px;padding:10px;"></textarea><script>document.getElementsByTagName('textarea')[0].focus()</script></body></html>