jquery - Persistent html menu in chrome extension -

i have menu shown on top of web page when click extension button. menu remain on page reload , when navigate domain - possible?

mainifest.json

"background": { "scripts": ["background.js"], "persistent": true  },   "content_scripts": [    {     "matches": ["http://*/*"],   "css": ["grid.css"],   "js": ["jquery-2.0.0.min.js"],        "all_frames": true    }  ], 

background.js

chrome.browseraction.onclicked.addlistener(function(tab) {    chrome.tabs.executescript(null, { file: "grid.js" }); }); 

grid.js

$(document).ready(function() { $("body").append("<ul id='menu'><li><a id='add' href='#'>add div</a></li></ul>") }); 

i'd try use localstorage save information in same moment click browser action of extension.

then in content_script, can check information in localstorage , show menu without having press extension button.

briefly, mean is:

manifest.js

"background": { "scripts": ["background.js"], "persistent": true  },   "content_scripts": [    {     "matches": ["http://*/*"],   "css": ["grid.css"],   "js": ["jquery-2.0.0.min.js", "content.js"],        "all_frames": true    }  ], 

background.js

chrome.browseraction.onclicked.addlistener(function(tab) {    chrome.tabs.executescript(null, { file: "grid.js" });    chrome.tabs.sendmessage(tab.id, {menu:'show'}, function(response) {     console.log('persistent menu started'); }); }); 

content.js

chrome.runtime.onmessage.addlistener(   function(request, sender, sendresponse) {     if (request.menu === "show")     {         localstorage.setitem("show_menu", "yes");     }   });  var showmenu = localstorage.getitem("show_menu");  if(showmenu === "yes") {     $(document).ready(function() {         $("body").append("<ul id='menu'><li><a id='add' href='#'>add div</a></li></ul>")     }); }