Can html text in p tag is resizable using jquery-ui or without p tag in a div tag is resizable? I have done resizing the image using jquery ui from following example but tex
You may use resize event handler. The trick is how to calculate new font size. Check this solution as a variant:
Html:
Javascript:
var initDiagonal;
var initFontSize;
$(function() {
$("#resizable").resizable({
alsoResize: '#content',
create: function(event, ui) {
initDiagonal = getContentDiagonal();
initFontSize = parseInt($("#content").css("font-size"));
},
resize: function(e, ui) {
var newDiagonal = getContentDiagonal();
var ratio = newDiagonal / initDiagonal;
$("#content").css("font-size", initFontSize + ratio * 3);
}
});
});
function getContentDiagonal() {
var contentWidth = $("#content").width();
var contentHeight = $("#content").height();
return contentWidth * contentWidth + contentHeight * contentHeight;
}
You may look this solution at jsFiddle: jsFiddle link