JavaScript
Article
By Sam Deering

Using jQuery to Test New Website Fonts

By Sam Deering

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.

font-dragr-tool

Instructions

  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 = 'http://fontdragr.com/bookmarklet/fd-script.js';
    h.appendChild(s);
})(document);

View the code: http://fontdragr.com/bookmarklet/fd-script.js

--ADVERTISEMENT--

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);
Recommended
Sponsors
The most important and interesting stories in tech. Straight to your inbox, daily. Get Versioning.
Login or Create Account to Comment
Login Create Account