Customizing the Autoscrolling Icon

By Alex Walker | January 17, 2005 | CSS

Here’s one from the ‘you could, though you probably wouldn’t, but it’s nice to know you can‘ department.

Tom was playing around with FireFox yesterday and came to the realization that the auto-scroll icon is actually inserted dynamically into the document’s HTML, but outside the HEAD and BODY — meaning it’s still within the clutches of our evil CSS.

Mwha Ha Ha HA!!

Try clicking your middle mouse button anywhere onscreen in FireFox 1+ to see the results.

Here’s the CSS:

html>img { width: 0!important; height: 28px!important; padding-left: 28px!important; background: url(/images/icons/autoscroll2.png); }

In reality this is a known bug, so can’t really be relied on into the future (though it’s been around for a long time), but if your client is looking for that little bit of extra branding…

Alex Walker

Alex manages design and front end development for SitePoint.com and writes for Design Festival's monthly design newsletter.

More Posts - Twitter - Pinterest - Google Plus

No related posts.

{ 29 comments }

Axeia June 30, 2008 at 2:34 am: Fixed in Firefox 3 for linux as well, shame really :(
Axpen June 19, 2008 at 10:34 pm: Firefox 3 has removed it, in windows at least.
I June 2, 2008 at 8:36 am: Yea, that ROCKS!!
AlexW August 3, 2007 at 4:54 pm: It’s still working fine in Firefox 2.0.0.6 but we make no guarantees about Firefox 6. ;)
arn August 3, 2007 at 12:56 pm: it didn’t work.– firefox 6, windows vista. :(
AlexW February 19, 2007 at 10:10 am: Hang on, it LIVES!!
It’s still working in FF 2.0.0.1 here to two different systems.
AlexW February 19, 2007 at 10:07 am: Yes, it appears this bug has been finally closed off in Firefox 2.0.
Ah, it had to happen someday.
aceonline February 17, 2007 at 1:58 am: dosnt work in firefox 2.0 either
pbkill March 31, 2006 at 4:52 pm: Does not work in IE 7 either.
Alan{H} June 14, 2005 at 1:32 pm: Thanks, that is too cool for words. It’s like an annoying Javascript that makes you go “wow i want that” but it’s not annoying!
john.stone February 4, 2005 at 10:13 am: Chalk this one up next to javascript mouse follows…
biggazillakilla January 30, 2005 at 2:58 am: Yes, this is an interesting find. Almost as cool as the favicon.
Ryan Wray January 19, 2005 at 8:57 am: Thanks for sharing that. I was wondering how sitepoint was using a custom auto-scroll icon (and was too lazy to investigate) and know I no. It can be good if used properly, like here. However, the website pointed out earlier (http://ln.hixie.ch/) is an example of inproper use.
Thanks,
CubitGuy January 18, 2005 at 5:20 pm: Deffinatly from the ‘you could, though you probably wouldn’t, but’s it’s nice to know you can’ department… My fav. place to hang out!
grafixgirl January 18, 2005 at 3:31 pm: Lovely – but it doesn’t seem to work in IE .
Percept January 18, 2005 at 1:52 pm: cool but useless (for the next couple of years anyway).
jgandu January 18, 2005 at 12:26 pm: Actually, the only thing I did was open this page in both Firefox and IE. In IE it scrolls but it doesn’t auto-scroll for some reason. Could be because of something else on the page. I do get a Javscript error on both browsers.
redux January 18, 2005 at 11:52 am: jgandu, i tested it in IE and it works fine…this CSS only hack shouldn’t really affect IE’s ability at all.
jgandu January 18, 2005 at 10:05 am: Cool, works in Firefox, but with it, auto-scrolling doesn’t work at all in IE.
Dean C January 18, 2005 at 9:36 am: Haha this is great :) Nice find!
j0n January 18, 2005 at 6:59 am: What an interesting bug. :)
xhtmlcoder January 18, 2005 at 6:03 am: Well, it is certainly different though I don’t know how well it fairs with usability and accessibility; some might think its spyware or something.
pete January 18, 2005 at 4:14 am: cool! Was being disabled by customizing the “autoscroll” feature with the “All-In-One Gestures” extension, but resetting that to “native Autoscroll” lets this hack work fine :)
Dangermouse January 18, 2005 at 2:33 am: Pretty cool :D
m0n5t3r January 18, 2005 at 2:13 am: nice :D works in thunderbird 1.0, too.
sumlogic January 17, 2005 at 10:07 pm: now how dope is this. What A Nice little touch. Good work diggin this up. Not like it’s critical or anything but it is the little things in life that count!
Sum
AlexW January 17, 2005 at 8:27 pm: Might need a hard refresh to clear the cached CSS, tonyskyday. It doesn’t work in all older versions but should in yours. Try Hixie’s where you’re unlikely to have cached CSS.
AlexW January 17, 2005 at 8:23 pm: Hixie’s Natural Log has a variation on it here.
tonyskyday January 17, 2005 at 8:23 pm: Doesn’t work for me. Firefox 1.0 WinXP.