So I have an extremely simple popup for a chrome extension that has a single button in the html.
<!DOCTYPE html>
<html>
<head>
<title>Extension popup</title>
</head>
<body>
<button id="dashboard">Button<button>
</body>
</html>
So it is only supposed to show one button but a second empty button is also shown. Inspecting the popup shows that there is indeed another button.
I am mostly wondering whether anyone knows what is going on here?
Related
I am aiming to build a google chrome extension that displays a different link to a different website every time it is used.
That is, I have a list of websites and I want to iterate through the list such that each time I click the extension the next link is shown.
Currently my popup.html file looks like this
<!DOCTYPE html>
<html>
<head>
<title>My First Chrome Extension</title>
<style>
#popup{
width:300px;
height:200px;
text-align:center;
line-height:200px;
}
</style>
<script src="popup.js"></script>
</head>
<body>
<div id="popup">
next link
</div>
</body>
</html>
(the popup.js file is empty). When I click my extension icon, it will display a link to "some_url.com" which opens in a new tab (great). What I am looking for is to be able to then display "another link" when I click the extension icon again ("another link" being the next from some predefined list).
I would be very grateful for help/resources to be able to add this behaviour to the extension. I am new to chrome extensions (and javascript) and don't know where to go next.
You can create a anchor tag with some id on popup.html page
<a id="show-links" target="_blank"></a>
Then in your popup.js file, add a hfref attribute to this element using javascript
var a = document.getElementById('show-links');
//create an array with all links
links_array = ["some_link.com", "some_link1.com", "some_link2.com"];
//assign links to a from array at random
a.href = links_array[Math.floor(Math.random() * links_array.length)];
I was testing a basic track html page from my desktop, and it seems that that the closed captioning works in Firefox and IE, but not Edge or Chrome. Edge shows the CC button and that it's running, but doesn't display any text, while Chrome doesn't even show CC button for me. From a website, they all work except Edge again. Ideas?
HTML:
<!DOCTYPE html>
<html>
<head>
<title>CC Track Test</title>
</head>
<body>
<video controls src="movie.mp4">
<track default kind="subtitles" label="caption" srclang="en" src="entrack.vtt" />
Sorry, your browser doesn't support embedded videos.
</video>
</body>
</html>
VTT:
WEBVTT
0
00:00:02.000 --> 00:00:14.000
This is a test caption.
1
00:00:18.700 --> 00:00:28.500
And this is a second test caption.
Can I use a page action to directly open a new page? I have a link in my popup.html, but it would be better to have the page open when they click the icon so that they would only need one click instead of two.
<!doctype html>
<html>
<head>
<title>Popup</title>
<link href="popup.css" rel="stylesheet" type="text/css">
</head>
<body>
click here
</body>
</html>
Yes, a way to achieve this would be as follows:
chrome.pageAction.onClicked.addListener(function(tab){
chrome.tabs.create({url: "http://www.domain.com/details.html", "active":true});
});
See Chrome Page Action | onClicked
Note that you will need to declare the tabs permission in your manifest file:
"permissions": ["tabs",...],
I don't think there is any elegant way to handle both the situations on page action click:
Open popup
Open a new page
If you always want to open a new tab with some URL whenever page action is clicked, just remove the popup. And use the code just like #Flo has mentioned.
chrome.pageAction.onClicked.addListener(function(tab) {
chrome.tabs.create({url: "http://www.example.com", "active":true});
});
PS: To remove the popup, there are two options:
Remove the popup from manifest.json
Pragmatically like chrome.pageAction.setPopup('')
I have an extension which adds a bar at the top of a webpage. i have inserted the iframe in the content script using
document.body.insertBefore(iframe, document.body.firstChild);
The iframe has a button
<button id="mybutton">Click to help</button>
When the user clicks the button I want to redirect them to a new url in the same window. Is this possible?
The reason I want to do this is on certain websites I would like to change the url to include an additional parameter. I chose the iframe option as it more visible than an extension in the bar. Therefore if there is an alternative way to do this I would be happy to learn about it.
Your iframe.....
<html>
<head>
</head>
<script type="text/javascript">
function changeParent(e){
parent.location="http://google.com.au";
}
function onLoad(){
document.querySelector("#mybutton").onclick = changeParent;
}
</script>
<body onload="onLoad()">
<a id="mybutton">Change Parents URL</a>
</body>
</html>
Would be a good case for info bars if they ever come out of experimental....
http://code.google.com/chrome/extensions/experimental.infobars.html
here is my problem:
http://img687.imageshack.us/img687/5391/88030081.gif
here is my simple page:
<html>
<head>
</head>
<body>
URL fixing provided by none
</body>
</html>
what do I need to do?
I see other extensions with width and height set to just fine, and i only enter some little text and I get linebreak,
this is the only thing I get stucked in developing my extension- this is just an example of what happens
Try:
body {min-width:300px;min-height:300px;}