dojox
Version:
Dojo eXtensions, a rollup of many useful sub-projects and varying states of maturity – from very stable and robust, to alpha and experimental. See individual projects contain README files for details.
60 lines (50 loc) • 1.62 kB
HTML
<html>
<head>
<title>Metrics tests</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css">
@import "../../../dojo/resources/dojo.css";
@import "../../../dijit/tests/css/dijitTests.css";
</style>
<script type="text/javascript" src="../../../dojo/dojo.js" data-dojo-config="isDebug: true, fontSizeWatch: true"></script>
<script type="text/javascript">
dojo.require("dojox.html.metrics");
var sz_to_cell = {};
var updateSize = function(){
var sz = dojox.html.metrics.getFontMeasurements();
for(var p in sz_to_cell){
sz_to_cell[p].innerHTML = sz[p];
}
}
dojo.addOnLoad(function(){
dojo.connect(dojox.html.metrics, "onFontResize", function(){
console.log("Text size changed: ", dojox.html.metrics.getFontMeasurements());
updateSize();
});
console.log("Scrollbar measurements: ", dojox.html.metrics.getScrollbar());
console.log("Font measurements: ", dojox.html.metrics.getFontMeasurements());
var sz = dojox.html.metrics.getFontMeasurements();
for(var p in sz){
var row = document.createElement('tr');
var rel = document.createElement('td');
var act = sz_to_cell[p] = document.createElement('td');
rel.innerHTML = p;
act.innerHTML = sz[p];
row.appendChild(rel);
row.appendChild(act);
dojo.byId('sz_table').appendChild(row);
}
});
</script>
</head>
<body>
<div>Try changing the text size of your browser (make sure you're not just zooming the view).</div>
<table border="1">
<tbody id="sz_table">
<tr>
<th>Relative size</th><th>Actual pixel size (px)</th>
</tr>
</tbody>
</table>
</body>
</html>