Response title
This is preview!
automatically split over multi-column
in Using jQuery
•
8 years ago
When text lines get too long they are difficult to read and so I would like to use the new css3 column-count feature with jQuery to automatically split main text div over multiple columns.
In my css I have
.multi_column {
-moz-column-count:2;
-webkit-column-count:2;
column-count:2;
}
in my document that has several iframes I have the following script
function multi_column(j) {
var width = $(this).width();
$(this).toggleClass("multi_column", (width > 500));
}
$("iframe").contents().find(".main").each(multi_column);
For each iframe this makes all things of class "main" have two columns whenever they are more than 500 pixels wide.
It is not very elegant being based on pixels and not doing 3 or 4 columns the wider it gets, so I was wondering if anyone else has a better way of doing it?
1