how can i resize font of div by resizing the div using jQuery?

Question

hello every one, can anyone please help me, how to resize font size by resize event of div using jquery ui plugin?

html :

<div>my testing data</div>

script :

$('div').resize(); //this function is called from resize plugin of ui jquery

i want to increase font size by resizing the div.

Answer 1

According to documentation, you can do something like this:

$("#dialog").bind('resize', function(event, ui){
   var height = $(this).dialog('option', 'height');
   $(this).css('font-size', height);
});

Consider your div has anid="dialog".

Hope this helps.

Answer 2

@Darmen is right. But, you can simplify the code a little bit by using some of the method overloads. Like the constructor:

$('#dialog').resizable({
    resize: function(event, ui) {
        ui.element.css({'font-size':'20px'});
    }
});