Hotlink Help

Since I moved my blogs onto a server which I control, I've been spending quite a bit more time looking at log files. While digging through a log file for the web server, I happened across some funny referrer names for my watermark plugin for jQuery. Hmmm. I pulled up the site, clicked view source, and sure enough there was a reference to

Hotlinking is bad. First of all, it's not nice. You are forcing your users to consume my bandwidth which I pay for. Granted, it's a trivial amount for my small plugins, but still, there is a principal involved here. Second, by hotlinking my javascript files, you are putting a whole lot of faith in my server staying online. This shouldn't be a problem going forward, but you can never tell when I'll decide to take the whole thing down to do some upgrades. Third and finally, your linking directly to javascript files which I host puts you and your users at risk of my scripts doing something malicious like capture keystrokes or put nasty images on your pretty site.

Now that I know there is a problem, I aim to fix it. I could be nice and put a friendly alert("Please don't hotlink to"); at the top of the file. I could just yank the files off the server and leave your page broken slightly. Those seem too nice. It's almost a new year and I'm feeling empowered. I want to be a little mischievous. I love a good prank; especially when said prank can teach a little lesson. Besides, none of the sites I've seen so far seem very large or important.

The problem with all of this is that I'm a little torn. I'm not sure what to do. I mean, imagine the possibilities! In no certain order, here's what I've thought about doing:

  • Inject a banner at the top announcing how awesome is.
  • Set a style display:none to the body of the page.
  • Cornify the offenders site.
  • For the watermark plugin specifically, I could hard code the watermark to say
  • Redirect to the google translated version of the site in Russian.
  • Alter the alignment of divs by a few pixels to mess up the layout.
  • Randomly animate things by timer or by event.
  • Change all of the links to point to
  • Change all image sources to point to a script which returns an upside down version.
  • A random selection of the above.

There are just too many options! Dear Reader, what should I do? Should I be conservative and just do an alert? Should I do something else? I'm not going to do anything profane, pornographic, or malicious. I just want to have a little fun. Please give me your input and ideas. I'd love to hear from you.

7 Comments so far

  1. Jared @ December 28th, 2009

    “A random selection of the above”.

    Also, I would add:

    * replace all instances of the site’s title with “ Is My Daddy.”
    * attach a mouseover and mouseout event handler to every element in the DOM that a) alerts “I like goats” or b) lowers the opacity of the hovered element by .10
    * override every elements click handler to return false.
    * better yet, overlay the viewport with a transparent .gif so the user can’t click anything.
    * or window.location.href the page to

  2. Harro @ December 29th, 2009

    Apply the filter to make everything grey 😉

    Inject a bit of your own google analitics at the bottom to track the pageviews of the persons site 😀

  3. John Bubriski @ December 29th, 2009

    – Replace ALL their images with your own, kinda like Cornify. Maybe a nice picture of you, or your dog.
    – Replace their images with a broken image… image.
    – Replace common words with the misspelled versions, or l33tify it? (The -> teh, to -> ot, suck -> 5ux0|2) You could probably find/make a plugin for that 🙂
    – Make it look like their site was officially hacked. Replace the whole page with a single “you’ve been hacked because you hotlinked” statement. Maybe that will actually teach them a lesson!
    – Inject a f***ed up video onto every page, like Don Hertzfeldt’s Intermission in the Third Dimension:

    Personally, I think you should do all of these with the randomizer and make it into a “jMayhem” plugin, and open source it!

  4. Russell Butturini @ December 29th, 2009

    It’s a sad, sad problem that isn’t new. There was an interesting situation a while back exactly like this one on MySpace. Several MySpace users had hotlinked to an image on another server. The guy replaced the image with goatse (google it if you’re not familiar, but be prepared to poke out your mind’s eye afterwards). The worst part? MySpace claimed it was a “hack”!

  5. Ryan @ December 30th, 2009

    Its upside-down-ternets time! Css injection (you could just as easily do a jquery pull to apply the styles to the elements directly, so as to avoid any cascade overriding)

    image {
    -moz-transform: scaleY(-1);
    -webkit-transform: scaleY(-1);
    transform: scaleY(-1);
    filter: flipv; /*IE*/

  6. Ryan @ December 30th, 2009

    Figured I’d amend my previous comment with the jquery line – for fun and bemusement. Really fun!

    jQuery(‘img’).css({‘-moz-transform’: ‘scaleY(-1)’, ‘-webkit-transform’: ‘scaleY(-1)’, transform: ‘scaleY(-1)’, filter: ‘flipv’})

  7. andre @ April 15th, 2010

    capture event mouseover on anchor elements, place them away from mouse and change innerhtml to 🙂

Leave a reply