https://github.com/johnantoni/jquery.onfontresize
uses an iframe, sized in ems, to detect font size changes and trigger a "fontresize" event
https://github.com/johnantoni/jquery.onfontresize
Last synced: over 1 year ago
JSON representation
uses an iframe, sized in ems, to detect font size changes and trigger a "fontresize" event
- Host: GitHub
- URL: https://github.com/johnantoni/jquery.onfontresize
- Owner: johnantoni
- License: mit
- Created: 2010-01-20T10:26:24.000Z (over 16 years ago)
- Default Branch: master
- Last Pushed: 2015-05-30T22:41:18.000Z (about 11 years ago)
- Last Synced: 2025-03-29T05:32:54.746Z (over 1 year ago)
- Language: JavaScript
- Homepage: http://www.tomdeater.com/jquery/onfontresize/
- Size: 96.7 KB
- Stars: 13
- Watchers: 0
- Forks: 4
- Open Issues: 2
-
Metadata Files:
- Readme: README.txt
- License: LICENSE
Awesome Lists containing this project
README
Tested with jQuery 1.2.3+ in: IE6/7, FF2 (Windows XP), FF2 (OS X), Safari 2.0.4
* uses an iframe, sized in ems, to detect font size changes and trigger a "fontresize" event
* heavily based on code by Hedger Wang: http://www.hedgerwow.com/360/dhtml/js-onfontresize.html
* "fontresize" event is triggered on the document object
* subscribe to event using: $(document).bind("fontresize", function (event, data) {});
* "data" contains the current size of 1 em unit (in pixels)
NOTE: Unlike any other "onfontresize" technique I've seen, Hedger's doesn't use a setInterval-style polling mechanism to detect the font size. Instead, it leverages browser native onresize events that are fired when a hidden iframe is sized in ems.
KNOWN ISSUES: Depending upon how the base font size in your document is specified (em, %, or keyword) the "pixels per em" calculation may not be consistent across browsers. Also, the event doesn't fire in IE if fonts are sized in px units.
// execute this code then use the browser
// font controls to see the event in action
$(document).bind("fontresize", function (event, data) {
$("#log").val(data + "px");
});