简单jQuery相等列插件

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了简单jQuery相等列插件相关的知识,希望对你有一定的参考价值。

A very simple plug-in I wrote to make x number of columns equal height. Looks for the column with the biggest height then sets the rest to the same. I'm sure it can be made cleaner, will look into that later.
  1. /**
  2.  * @projectDescription Simple Equal Columns
  3.  * @author Matt Hobbs
  4.  * @version 0.01
  5.  */
  6. jQuery.fn.equalCols = function(){
  7. //Array Sorter
  8. var sortNumber = function(a,b){return b - a;};
  9. var heights = [];
  10. //Push each height into an array
  11. $(this).each(function(){
  12. heights.push($(this).height());
  13. });
  14. heights.sort(sortNumber);
  15. var maxHeight = heights[0];
  16. return this.each(function(){
  17. //Set each column to the max height
  18. $(this).css({'height': maxHeight});
  19. });
  20. };
  21. //Usage
  22. jQuery(function($){
  23. //Select the columns that need to be equal e.g
  24. $('div.column').equalCols();
  25. $('#col1,#col2,#col3').equalCols();
  26. });

以上是关于简单jQuery相等列插件的主要内容,如果未能解决你的问题,请参考以下文章

25个可遇不可求的jQuery插件

使用没有插件的 jQuery 输入相等检查

几个非常实用的JQuery代码片段

VSCode插件开发全攻略代码片段设置自定义欢迎页

Java技术jQuery自定义插件开发实践

JQuery DataTable 插件宽度问题