I've created a userscript that shows a tooltip for any links that start with:


It works with both name and with multiverseid in the query string.

HoverCard: BoardGames.SE MTG Gatherer Card Link Rollover

It will display a tooltip centered under the hyperlink. If there isn't enough room to display it under the link, it will display it above instead. If the link spans multiple lines, the tooltip will snap to the far left under the lowest line.

After enabling the userscript, reload this page and test it for yourself:

Ampersands (&), slashes (/) and colons (:) are broken when used with [mtg:] MarkDown. You must use multiverseid:


  • Gatherer doesn't seem to like https calls, so the script breaks on a secure connection. I added an explicit http: to the imageUrl and that makes the script work, but that introduces a mixed-content warning. Apr 14, 2016 at 18:43
  • @MichaelSnook Thanks for the feedback. Can you link an example question where this happens for you? I'd like to reproduce it so I can think of a way to deal with this. Apr 14, 2016 at 21:17
  • Sure, compare boardgames.stackexchange.com/questions/29716/… with boardgames.stackexchange.com/questions/29716/… -- it works with the second page but not the first. Apr 14, 2016 at 21:22
  • 1
    I did some debugging, the issue is that if you use https for stack exchange, the user script defaults to https for the gatherer search as well, but gatherer doesn't answer. Apr 14, 2016 at 21:24
  • 1
    @MichaelSnook That's correct. I can't build a way around this. Since Wizards.com doesn't provide the card API on HTTPS, I will have to force it on HTTP. If it causes your browser to spasm over mixed-content, that is normal behavior. Thanks for reporting :) Apr 15, 2016 at 7:55
  • 4
    I'm clicking card links then remembering I don't have to anymore. Can I just thank you again for making this? It's so good. Apr 16, 2016 at 6:49
  • I'm getting Javascript errors using this, around the value of the selector. What is the "i" at the end of the href filter? 'a[href*="://www.wizards.com/magic/autocard.asp" i]'
    – GendoIkari
    Oct 3, 2016 at 14:14
  • i makes the selector case-insensitive. It's a CSS4 selector. It's not supported by all browsers yet. Oct 3, 2016 at 14:22
  • Thanks, hadn't seen that. I'm using an up-to-date Chrome though and it's giving me an unrecognized expression error in jQuery. Here's a simple-case Fiddle showing the same thing: jsfiddle.net/6e2ezdud
    – GendoIkari
    Oct 3, 2016 at 14:30
  • @GendoIkari I'm also getting errors. It seems like the i directive is no longer working in Chrome, but I'm chalking this up to Chrome (because it's still valid CSS4). I also still need to update the script with doppelgreener's bug below. I'll write an update this week. Oct 3, 2016 at 14:32
  • Cool thanks. I hadn't known about this until today, but look forward to using it!
    – GendoIkari
    Oct 3, 2016 at 14:33
  • Looks like a jQuery support thing. Works for selectors in general in Chrome and Firefox, but gives that error in both when using it as a filter in an 'on()' method.
    – GendoIkari
    Oct 3, 2016 at 14:39
  • 1
    Just updated to v1.0.6. It no longer uses [... i] so it shouldn't break anymore. Also I added support for Search urls and I noticed there was a Handler url so I added those two for matching. Oct 5, 2016 at 19:16
  • 1
    Additionally, it seems that Chrome no longer allows loading HTTP resources on a HTTPS site. So it's forcing the image url to https://, which doesn't work on the Gatherer site. I think that effectively killed this userscript. Jul 3, 2018 at 14:55
  • 1
    The greasyfork script isn't updated yet with those changes. Should we be fetching the script directly from the Github raw file (github.com/mdingena/HoverCard/raw/master/hovercard.user.js)? Jan 14, 2019 at 11:04


You must log in to answer this question.

Browse other questions tagged .