Instantly share code, notes, and snippets.

@abernier /README.md
Last active Jan 27, 2018

Embed
What would you like to do?
Baseline detection
alert $('body').baseline()
<!DOCTYPE html>
<html>
<head>
<meta charset=utf-8>
<title></title>
<script src="http://code.jquery.com/jquery-latest.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/coffee-script/1.12.8/coffee-script.js"></script>
<script src="jquery.baseline.coffee" type="text/coffeescript"></script>
<script src="index.coffee" type="text/coffeescript"></script>
</head>
<body>
</body>
</html>
$ = @jQuery ? require 'jQuery'
detectBaseline = (el = 'body') ->
###
+----+ ^
| +-+| | baseline
|.|A|| v
| +-+|
+----+
###
$container = $('<div style="visibility:hidden;"/>')
$smallA = $('<span style="font-size:0;">A</span>')
$bigA = $('<span style="font-size:999px;">A</span>')
$container
.append($smallA).append($bigA)
.appendTo(el);
setTimeout (-> $container.remove()), 10
$smallA.position().top / $bigA.height()
$.fn.baseline = ->
detectBaseline(@get(0))
@abernier

This comment has been minimized.

Show comment
Hide comment
Owner

abernier commented Jul 23, 2012

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment