How to create a menu page in my chrome extension - javascript

I don't know how to create a menu page / popup in a chrome extension (not sure if thats actually what its called). I am very new to coding chrome extensions, and I was wondering how to create a new page in my chrome extension, just like in a website in which you click a button and it brings you to a different page within the website. This is a screenshot of the 2048 menu page on chrome ->2048 Menu Page and im not sure how to create a page like that. I am creating a button-pressing game, and I want my menu page to pop up first when the chrome extension icon is clicked, and then there is a list of options like hardcore, begginer etc. and a button to bring me to the game page itself, but still in the same popup, with the same dimensions, exactly like 2048. Does it have something to do with the popups, the manifest.json file? Im really not sure...
Here is the Screenshot of my manifest.json file and here is the Screenshot of popup.html. If anyone knows how to do this, or needs any extra info, please let me know 🙏🏻
PS: Pls explain and show me step by step like im a kindergarden kid, cuz at this stage in my coding skills i probs am ngl.

Related

Strange JS redirect & 404

I created a new toolbar for this site and I get this really strange new tab / redirect when on mobile if I rotate the device and try to navigate through the toolbar.
https://www.birthinjurysafety.org/[object%20MouseEvent]&visitorId=a625aeab-d753-41bc-bd93-a9830020e101?__utma=236318866.1681129442.1540344287.1540346383.1540359074.2&__utmb=236318866.1.10.1540359074&__utmc=236318866&__utmx=-&__utmz=236318866.1540346383.1.1.utmcsr=(direct)|utmccn=(direct)|utmcmd=(none)&__utmv=-&__utmk=142272497
Anyone know why JS would do this? Oddly enough the button that causes this strange new tab to open isn’t even a link itself. It just opens the next menu.
Thanks in advance for any help or suggestions! I’m really at a loss with this one.
The toolbar is built in vanilla JS. Except the button itself has some old jQuery dependent code that animates the button and shows the menu.

How can I add a close button to pop up window

I am in way over my head, new to S/O and need to get this done as soon as possible. If I am doing this wrong I apologize in advance.
I purchased an extension that was simple enough to install but I need to extend the function just a but. I reached out to the developer to no avail.
Anyway I need to add a close button to the pop ups featured on the home page of this website (http://www.juanlafontalaw.com) Click on one of the hotspots (Red) and the pop up will appear. I simply need to add a close button or X that will allow the user to close the pop up without touching the main screen.
The site is Wordpress based. Plug-in: Visual Composer. The Extension: Visual Composer Add-on Image Hotspot with Tooltip (This is the focal point of my question)
I have no idea where to begin and did not expect to be in this position. And I did not think the develop -who does offer support to totally ignore my
Make a button in html, and use jquery click function to make display none in the pop up
$("#btn-id").click(function(){
$("pop-up").css("display","none");
})

Browsing 1 link and out another tabs with different links

I want to write codes in my blogger to show when I browsing link likes www.12345.blogspot.com(example) ,after loading inside ,it will auto out anothor tabs in browser to run links which set by me.
So, example is i typing link of www.12345.blogspot.com and press enter to browse and will out another tabs likes www.youtube.com ,the focus point in webpage still in first (www.12345.blogspot.com).
Any codes could write about what I describe? Sorry for my bad english
If I understand you correctly, when loading a website, you want to open a second website in a separate tab while maintaining focus on the first tab. Here's how you'd do it:
var w=window.open("https://google.ie");
if(w)w.blur();
I would, however, advise very strongly against doing this.

What method should I use to make a Chrome toolbar?

I have this small toolbar-like html page:
Currently, a user clicks on a link and this page opens in a new tab at the size shown. The user places this at the top of their screen then opens another tab below it taking up the rest of their screen. The user mainly works out of the larger window and interacts with this "toolbar" periodically.
This setup is obviously not ideal. Especially since you cant hide the chrome frame or the address bar which make the toolbar twice the height it needs to be.
What I'd like to do is make this an actual tool bar in Chrome, something like:
I did see How to make a toolbar in Google Chrome? but I'm not sure which method would best suit my needs.
A few details:
The toolbar must remain visible anytime its turned on/opened (as I
understand it 'infobars' close themselves when not active? not 100%
on that though)
Navigating to a new page should not close the bar
Navigating to a new page should not reload / render the bar (as I understand it using content scripts would reload the bar every time the user goes to a new page,)
I guess we could use a content scripts / local storage type solution to render the bar then set it up as it was on the previous page, seems hacky though.
Am I missing a better way to do this?
Could anyone help me get started down the right path to achieve this result?
A toolbar is an extension.
use content script. The easiet way would be to download a sample from official google chrome's developper site.. and you will be able to change it the way you want.

downloading images using javascript from a single Chrome tab

i came across this script on the web:
javascript:(function(){function I(u){var t=u.split('.'),e=t[t.length-1].toLowerCase();return {gif:1,jpg:1,jpeg:1,png:1,mng:1}[e]}function hE(s){return s.replace(/&/g,'&').replace(/>/g,'>').replace(/</g,'<').replace(/"/g,'"');}var q,h,i,z=open().document;z.write('<p>Images linked to by '+hE(location.href)+':</p><hr>');for(i=0;q=document.links[i];++i){h=q.href;if(h&&I(h))z.write('<p>'+q.innerHTML+' ('+hE(h)+')<br><img src="'+hE(h)+'">');}z.close();})()
And it fairly opens up all the images of a tab whose address bar you run the script in, in a new tab.
But that new tab, opens up as an about:blank tab, and when i press Ctrl+S to download the page, and hence thereby getting all the images opened in that tab, what i hope would happen doesn't.
Ctrl+S doesn't work on about:blank, and i kinda hoped there would be some way to download those images opened in this kind of tab. How do i do this? Is there any way in JavaScript to achieve this?
i searched around the web, and found wget, but i didn't really get it. Is there any easier way altogether to just download images from a tab using javascript?

Categories

Resources