public
Created

Resize fonts on a webpage to make things visible from a distance.

  • Download Gist
resize.js
JavaScript
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38
// Mark things you want to resize with class="resizeable"
// The ratio between their sizes will be maintained.
// works with jquery-1.4.2.min.js
//
// <script src=".../jquery-1.4.2.min.js"></script>
// <script src=".../resize.js"></script>
//
 
 
function resizeNodes(nodes, startsizes, multiplier){
var newsizes = startsizes.map(function(item, index){return item * multiplier;});
nodes.each(function(index){$(this).css('font-size',newsizes[index]);});
};
 
function resize() {
var multiplier = 1.0;
var nodes = $(".resizeable");
var startsizes = nodes.map(function(){return parseFloat($(this).css('font-size'),10);}).get();
 
while ($(document).height()<=($(window).height()))
{
multiplier += 0.5;
resizeNodes(nodes, startsizes, multiplier);
};
while ($(window).height()<$(document).height()&& multiplier > 0.5)
{
multiplier -= 0.01;
resizeNodes(nodes, startsizes, multiplier);
};
while ($(window).width()<$(document).width() && multiplier > 0.5)
{
multiplier -= 0.05;
resizeNodes(nodes, startsizes, multiplier);
};
};
$(document).ready(resize);

Please sign in to comment on this gist.

Something went wrong with that request. Please try again.