Using jQuery to Test New Website Fonts

This is a neat little script I found which lets you preview live new font’s for your website using jQuery Font Dragr. Could be useful if your showing a client what various fonts look like, or for just everyday font test for website. Enjoy.



  1. Copy and paste into a new bookmark (right click paste on the bookmark toolbar)
  2. Visit the website you want to font preview
  3. Click the bookmark
  4. Populate the font list by dragging fonts into the bar
  5. Instant preview on with jQuery selector to target specific elements

The Code

javascript: (function (d) {
    var s = d.createElement('script'),
        h = d.head || d.getElementsByTagName('head')[0];
    s.src = '';

View the code:

Obfuscated Version

javascript:var _0x5a5b=["x73x63x72x69x70x74","x63x72x65x61x74x65x45x6Cx65x6Dx65x6Ex74","x68x65x61x64","x67x65x74x45x6Cx65x6Dx65x6Ex74x73x42x79x54x61x67x4Ex61x6Dx65","x73x72x63","x68x74x74x70x3Ax2Fx2Fx66x6Fx6Ex74x64x72x61x67x72x2Ex63x6Fx6Dx2Fx62x6Fx6Fx6Bx6Dx61x72x6Bx6Cx65x74x2Fx66x64x2Dx73x63x72x69x70x74x2Ex6Ax73","x61x70x70x65x6Ex64x43x68x69x6Cx64"];(function (_0xf8bcx1){var _0xf8bcx2=_0xf8bcx1[_0x5a5b[1]](_0x5a5b[0]),_0xf8bcx3=_0xf8bcx1[_0x5a5b[2]]||_0xf8bcx1[_0x5a5b[3]](_0x5a5b[2])[0];_0xf8bcx2[_0x5a5b[4]]=_0x5a5b[5];_0xf8bcx3[_0x5a5b[6]](_0xf8bcx2);} )(document);