Jquery Resize Line of text To Fit Div Width

Posted by Douglas Cottrell on Stack Overflow See other posts from Stack Overflow or by Douglas Cottrell
Published on 2012-11-10T04:50:03Z Indexed on 2012/11/10 4:59 UTC
Read the original article Hit count: 150

I am using the following script to resize a one line string to fit properly in a div box.

<script type="text/javascript"> 
$( '.test' ).css( 'font-size', 0 ).each(function ( i, box2 ) {
    var width = $( box2 ).width(), line = $( box2 ).wrapInner( '<span style="white-space:nowrap">' ).children()[ 0 ];
    function changeFontSize( n ) { $( box2 ).css( 'font-size', function ( i, val ) { return parseInt( val, 10 ) + n; }); }
    while ( $( line ).width() < width ) { changeFontSize( 1 ); }
    changeFontSize( -1 );
    $( box2 ).text( $( line ).text() );
});
</script>

This script works perfect in FF, Chrome, and opera. However in IE if the user is in compatability mode it errors and locks up the browser. I do not know enough about the older browsers to know what I have added that is not compatible.

Any help is greatly appreciated.

© Stack Overflow or respective owner

Related posts about JavaScript

Related posts about jQuery