Changeset 3066474

Timestamp:

04/08/2024 12:16:58 AM (2 years ago)

Author:

MIGHTYminnow

Message:

Tested up to 6.5.0 and updated readme

Location:

equal-height-columns

Files:

• tags/1.2.0/readme.txt (modified) (2 diffs)
• trunk/readme.txt (modified) (2 diffs)

equal-height-columns/tags/1.2.0/readme.txt

@@ -4 +4 @@
 Tags: equal, height, column, div, element, jQuery, JavaScript
 Requires at least: 3.5
-Tested up to: 6.4.3
+Tested up to: 6.5.0
 Stable tag: 1.2.0
 License: GPLv2 or later
@@ -90 +90 @@
 This plugin is [on Github](https://github.com/MIGHTYminnow/equal-height-columns) and pull requests are always welcome.
 
+= NEW: Multi rows =
+
+On version **1.2.0** we are introducing a new feature *(for now, only available via JavaScript)* that resolves a common issue if the row number of certain elements varies across breakpoints when the number of columns change.
+
+For example, if we have 2 columns for tablets and 3 columns for desktops, the third element in the group would be positioned on the second row for tablets but on the first row for desktops.
+
+Before this new feature, the equal height would be based on all the elements from the group. Now you can have "subgroups" for each row, and recalculate when the number of columns in the rows change.
+
+To use this new feature add the function once per breakpoint:
+
+    jQuery( document ).equalHeight( selector, columns, minWidth, maxWidth );
+
+ **selector:** The selector of the group of elements that you want to apply the equal height.
+
+ **columns:** The number of columns per row on the breakpoint.
+
+ **minWidth:** The minimum width of the breakpoint. Use 1 for mobile.
+
+ **maxWidth:** The maximum width of the breakpoint. You can leave empty for the biggest breakpoint.
+
+The following example would apply equal height for headings with the class **.demo-heading** in a grid that has 1 column per row on mobile, 2 columns on tablet and 3 columns on desktop:
+
+    $( document ).equalHeight( '.demo-heading', 1, 1, 767 ); // 1 columns for 1px - 767px
+    $( document ).equalHeight( '.demo-heading', 2, 768, 1024 ); // 2 columns for 768px - 1024px
+    $( document ).equalHeight( '.demo-heading', 3, 1025 ); // 3 columns for 1025px (and above)
+
 == Frequently Asked Questions ==
 

equal-height-columns/trunk/readme.txt

@@ -4 +4 @@
 Tags: equal, height, column, div, element, jQuery, JavaScript
 Requires at least: 3.5
-Tested up to: 6.4.3
+Tested up to: 6.5.0
 Stable tag: 1.2.0
 License: GPLv2 or later
@@ -90 +90 @@
 This plugin is [on Github](https://github.com/MIGHTYminnow/equal-height-columns) and pull requests are always welcome.
 
+= NEW: Multi rows =
+
+On version **1.2.0** we are introducing a new feature *(for now, only available via JavaScript)* that resolves a common issue if the row number of certain elements varies across breakpoints when the number of columns change.
+
+For example, if we have 2 columns for tablets and 3 columns for desktops, the third element in the group would be positioned on the second row for tablets but on the first row for desktops.
+
+Before this new feature, the equal height would be based on all the elements from the group. Now you can have "subgroups" for each row, and recalculate when the number of columns in the rows change.
+
+To use this new feature add the function once per breakpoint:
+
+    jQuery( document ).equalHeight( selector, columns, minWidth, maxWidth );
+
+ **selector:** The selector of the group of elements that you want to apply the equal height.
+
+ **columns:** The number of columns per row on the breakpoint.
+
+ **minWidth:** The minimum width of the breakpoint. Use 1 for mobile.
+
+ **maxWidth:** The maximum width of the breakpoint. You can leave empty for the biggest breakpoint.
+
+The following example would apply equal height for headings with the class **.demo-heading** in a grid that has 1 column per row on mobile, 2 columns on tablet and 3 columns on desktop:
+
+    $( document ).equalHeight( '.demo-heading', 1, 1, 767 ); // 1 columns for 1px - 767px
+    $( document ).equalHeight( '.demo-heading', 2, 768, 1024 ); // 2 columns for 768px - 1024px
+    $( document ).equalHeight( '.demo-heading', 3, 1025 ); // 3 columns for 1025px (and above)
+
 == Frequently Asked Questions ==