Move to top of page with chrome-extension_问答_开发者

Move to top of page with chrome-extension

开发者 https://www.devze.com 2023-01-29 20:43 出处：网络

does anybody know a command to bind \"scroll 开发者_开发知识库to top\"/ \"jump to top\" function to a button?

does anybody know a command to bind "scroll 开发者_开发知识库to top"/ "jump to top" function to a button?

I found something more fancy, but would like to have a more simple version: https://chrome.google.com/extensions/detail/chiikmhgllekggjhdfjhajkfdkcngplp

Much appreciated.

Well, you can just do the following, scroll to X=0, and Y=0, and thats it https://developer.mozilla.org/en/window.scroll

window.scroll(0, 0);

If you want to hook that up to Google Chrome Extensions, all you need to do is create a JavaScript file and inject it to your page:

background.html

chrome.browserAction.onClicked.addListener(function(tab) {
  chrome.tabs.executeScript(tab.id, {code: 'window.scroll(0, 0);'});
});

manifest.json

Make sure you have the tabs permission and browser action:

  ...
  ...
 "browser_action": {
   "default_icon": "some_icon.png",
 },
 "permissions": [
   "tabs",
   "http://*/*"
 ],
  ...
  ...

I havn't tested that, but it will give you an idea how to send a command from Chrome to Website through extensions via browser action button. Once you click on that button, it will execute a script to scroll that page to the top.absolute top.

Home
(Simple, no over-thinking.)

To create an element with id "top" at the beginning of body, and assign the href of the "go to top" button to "#top", or add an event listener to it.

If you want it to show on the page persistently, use CSS rule position: fixed and appropriate other attributes.

Chrome extensions are html/js, right ? So just set the scrollTop attribute of <body> to 0. Maybe there'is a more elegant way but this work :

<script>
function setScroll()
{
    document.getElementsByTagName("body")[0].scrollTop = 0;
}
</script>

<input type="button" value="Set scrollTop to 50" onclick="setScroll();" />