View Background Image
Update 11/5/2008: There’s now an extension for this!
Of all the context menus in Firefox, my second most-clicked item (behind View Page Source) is View Background Image. This stock functionality is one of the many reason I still prefer to use Firefox over Safari, even though Safari’s rendering is notably faster. The problem I have with View Background Image though is that the image I want to view is often associated with a link element. When you right-click on a link though, this menu item is sadly missing.
The only alternative I’ve found, short of digging around in the page source and CSS, involves the Web Developer Toolbar. If you have this extension installed, you can click on Images » View Image Information to see a list of all background images that are associated with the page you are viewing. That usually does the trick, but it would be much more ideal if there were an extension that just makes View Background Image work on links. After all of my searching and discussions with friends and coworkers I’ve concluded that there is no extension out there that can make this happen. I’ve never made a Firefox extension before, but I have toyed around with Javascript/XUL and could probably figure it out if I get desperate enough. Before I attempt this though, I figured I’d ask, “What do you do when you want to see the background image of a link?”
About this Entry
- Publish Date: 07/30/2007 at 11:32am
- Filed Under: Code
- Feedback: 7 Comments
- Previous Post: Our Fourth
- Next Post: CSS CacheBuster
7 Comments
Sorry, comments are now closed on this post. If you have feedback or need to contact me about something on this page, you can use the contact form.
I do the same thing!
The only other way I’ve managed to find the image if not using the web developer toolbar is by actually finding the reference to it within the style sheet; what can you do?
It may only be a little quicker than your process, but this is how I would go about it…
First, pop up Firebug (an amazingly useful developer extension), then click “Inspect” and click on the link whose background you want to find. Once you do, you’ll see the source code of the link the left side of Firebug, and the CSS on the right side. If you mouse over the filename of the image in the CSS panel it’ll give you a little hover preview of the image and it’s dimensions. From there, you can right-click and “Open image in new tab”.
This may sound link a long process, but after you do it a few times, it becomes second nature.
Hope this helps!
I just stumbled across your site Jason and saw this post. I have to agree, this is my most clicked menu item in Firefox as well. I reckon I click View Background Image easily 40+ times a day :D.
Hi Jason,
I created an extension called ThisTab! which forces links to open in the current tab – i suspect to change this to do what you want, it’d be a very small change to my code:
Firefox took it off the addons page because i never submitted an FF2 friendly version to their addons page, but i did actually update it, you can find it here: http://www.jamesbooker.co.uk/projects/thisTab/download/thistab-2.0.xpi
I hope this helps
Jason,
I’ve started you off. It’s very basic – it assumes that image url’s in the css are absolute and not relative (at least i think it does – I’m not 100% sure about the intricacies of getcomputedstyle) but it does actually work:
http://www.jamesbooker.co.uk/projects/linkbackimage/download/linkbackimage-1.0.xpi
Let me know what you think (you obviously have my email from this comment)
Dude! You Rock! I can’t wait to play around with this. Thanks, James!
Jason – did you get any further with it? Or did the extension do exactly what you wanted?
<Big, heavy hint>By the way, the hardcover version looks very nice!</Big, heavy hint>