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

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 i开发者_开发技巧s called from resize plugin of ui jquery

i want to increase font size by resizing the div.

---

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.

---

@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'});
    }
});

---

Instead of getting the height again accessing 'option' you can use the ui object, it will give you start size, end size and location too.

* ui.helper - a jQuery object containing the helper element
* ui.originalPosition - {top, left} before resizing started
* ui.originalSize - {width, height} before resizing started
* ui.position - {top, left} current position
* ui.size - {width, height} current size