53% CPU usage for displaying something as simple as a couple of images with panning and fades.

Here’s what it looks like:

The ID for the popout is share_popout in case you want to hide it using user styles. Here’s what you can use for Stylish:

@namespace url(http://www.w3.org/1999/xhtml);
 
@-moz-document domain("blog.okcupid.com") {
    #share_popout {
        display: none;
    }
}

Yes, this is actually possible and quite easy because all one has to do is register an event handler for the onCopy event. The sites I’ve stumbled upon so far are using it to add some text like “Read more at …”.

This is extremely annoying because it breaks my workflow in several situations, not limited to:

• When I want to search the web using the copied text: I will first copy the text (Ctrl + C) and then paste it into the search box using (Ctrl + K and Ctrl + P) (possibly adding more search terms).
• When I want to copy the text for use in a blog post (like this one).

If you don’t understand why this is annoying, you just don’t get it.

So for now I’ve enabled NoScript again, but as NoScript whitelists domains it means some websites might still slip through the cracks. If I get annoyed enough I might look into the possibility of removing attached event handlers using JavaScript injection (e.g. through GreaseMonkey).

So to stop the madness once and for all I decided to take the law into my own hands and user customize the user customizations using Stylish (userContent.css is too unwieldy as you have to restart Firefox). All you have to do after installing Stylish is add the following user style (note that the !important bit is required to override the original author’s rules with those from the user stylesheet):

UPDATE: turns out users can could customize colors too so I added the necessary declarations to put an end to that to.

@namespace url(http://www.w3.org/1999/xhtml);
 
@-moz-document domain("twitter.com") {
    /* Change the background image and color */
    body {
        color: #333333 !important;
        background: #9AE4E8  url(http://assets2.twitter.com/images/bg.gif)  no-repeat fixed left top !important;
    }
 
    /* Change the default font color */
    body, ul#tabMenu li a, #side .section h1, #side .stat a, #side .stats a span.stats_count, #side div.section-header h1, #side div.user_icon a, #side div.user_icon a:hover, #side div.section-header h3.faq-header, ul.sidebar-menu li.active a, li.verified-profile a, #side .promotion a {
        color: #333333 !important;
    }
 
    /* Change the font color for most links */
    a, #content tr.hentry:hover a, body#profile #content div.hentry:hover a, #side .stats a:hover span.stats_count, #side div.user_icon a:hover, li.verified-profile a:hover, #side .promotion .definition strong {
        color: #0084B4 !important;
    }
 
    /* Change the font color of the line containing the time of the notice and some other bits  */
    ol.statuses span.meta a, .hentry .meta a {
        color: #999999 !important;
    }
 
    /* The rest is for for the menu on the right */
    #side_base {
        background-color: #DDFFCC !important;
        border-left: 1px solid #BDDCAD !important;
    }
 
    #side hr {
        background: #BDDCAD none repeat scroll 0 0 !important;
    }
 
    /* Headers in the side menu */
    ul.sidebar-menu li.active a, ul.sidebar-menu li a:hover, #side div#custom_search.active, #side .promotion, .notify div {
        background-color: #EDFFE5 !important;
    }
}

And you’ll end up with just a pretty cloud and the default theme colors :-)

UPDATE: turns out somebody else had already written another user style to achieve this. No problem though as it was fun to do this myself and I learned quite a bit in the process about using Stylish properly :-)