0

I have inserted an image in a div using CSS to all the pages on a certain domain, using my Google Chrome extension. Users keep asking me to link the image to the domain's home page. I don't know how to do this.

The image is at the top right of the page. Basically I just need to inject the html 

<a href="domain.com">[IMAGE]</a>

where [IMAGE] is the image.

I don't think I can do this with CSS, so I don't know how to do it.

UPDATE:

I need to append it to a current element, not make a new element.

1 Answers1

0

You may add a js file injecting the proper html instead of just using a css file.

Here's how your js could be :

var node = document.createElement("a");
node.setAttribute('href',"http://canop.org");
var img = document.createElement("img");
img.setAttribute('src', "http://canop.org/chrall/screens/screen_01.png");
node.appendChild(img);
document.body.​insertBefore(node, document.body.​​​​​​​​​​​​​firstChild);​

Here's a fiddle demonstrating the js : http://jsfiddle.net/dystroy/sftAX/

Denys Séguret
  • 372,613
  • 87
  • 782
  • 758
  • and I need to position it on the page and write css for it. –  Apr 25 '12 at 20:35
  • figured it out. `img.setAttribute('id', "img-link");` then do the css for `#img-link` as desired. –  Apr 25 '12 at 20:43
  • wait how do i put the HTML in a certain place on the page, with relation to other HTML elements?? This method only puts it at the top. –  Apr 25 '12 at 20:53
  • I need to append it to a **current** element, not make a new element. –  Apr 25 '12 at 20:55
  • If you want to put it elsewhere, you'll have to tune the code according to your needs. Change "document.body" to the node before which you want to add yours. – Denys Séguret Apr 26 '12 at 05:58