continuous font size control like in Excel
continuous font size control like in Excel
veloopity
Posts: 87Questions: 36Answers: 2
is this possible? I think it would be way cool to have a slide control like in the lower right corner in Excel, controlling font size in a continuous manner. (My tables can be very large and a feature like that would be very helpful.)
-Michael
This question has an accepted answers - jump to answer
This discussion has been closed.
Answers
It isn't something that would be in DataTables core, but I don't see any reason why a simply slider (html5 or library) couldn't be used to set the CSS font-size of the table as the slider is dragged.
Allan
can you think of a simple javascript statement that would affect the font size of all cells in the datatables table, thus effectively resizing the table? I'm not sure what CSS element to address.
IMHO, this functionality would be very useful to many users who have to deal with very large tables.
-Michael
Its the first time I've come across this request, so I'm not sure how many would find it useful to be honest, but I can see that it would be in some cases!
Just apply the
font-sizeto thetable: http://live.datatables.net/seliwaco/1/edit .Allan
+1 for this as a good idea (from someone else dealing with complex tables).
I figure you would just add a class (for example, 'resizable') to the
<table>tag in the html, and target this class to adjust the the font-size css attribute. There are lots of libraries around that provide a widget or buttons to scale the % of font-size up and down (eg, http://www.jqueryscript.net/demo/jQuery-Plugin-For-Altering-The-Font-Size-On-Sites-jFontSize/, but worth looking around at other options at least to see how they are implemented).In my case, I have some columns headings that are long enough to control the column width (that is, the heading text is longer than any of the contents in the column). Thinking a couple of steps ahead, I'm wondering if we allow the user to scale down the font-size, we might want to redraw the table so that the column width would be adjusted (uncertain about this), and also save the font-size setting as other configurations are saved via stateSave or comparable.....
I'm glad someone liked my idea (which, incidentally, didn't even come from me but from my wife who saw the large tables on my screen and, being used to the Excel resize scrollbar at her workplace, asked if my tables could do the same because they were too large).
Allan I've added your example to my code (you should still have the URL and password, sent May 12), I've added a hidden form field and a (+/-) link above the datatables that reloads the complete page. The function is executed with the changed font sizes but for some reason, no change happens. Of course, the more elegant thing to do would be a direct font size change without page reload but I'm so hopelessly jQuery illiterate I don't know how to do that.
And yes, a redraw of the table would probably be necessary - simply changing the font size like in Allan's example doesn't seem to change the table size. Would a font size change and a subsequent redraw automatically change the cell dimensions, fitting the changed font sizes?
Do you want to double the table size as well? If so, define the padding on the cells using
emunits rather thanpxsinceemis relative to the font-size.Allan
yes but it is mostly about making large tables smaller. For tables with 10 columns or so, the standard size works well but when we have 15 or 20 or even more columns, it gets difficult to handle.
Will try the em thing as soon as I have a working function that changes font size.
-Michael
A couple of lines of jQuery is all that is needed: http://live.datatables.net/bunageda/1/edit .
Allan
wow ! looks just like what I need ... 1000 thanks ... it doesn't work on my page so far ...