【问题标题】:news display modules height新闻显示模块高度
【发布时间】:2012-02-15 07:59:47
【问题描述】:

我正在使用一个 joomla 模块来显示来自 8 个不同类别的文章,该模块显示每个类别的标题和一些介绍性文字(同一个模块使用了 8 次)。

例如,一篇文章的标题需要显示两行 - 另一篇只需要一行,而且它们没有同时显示,所以我的网站看起来很乱!

问题是:如何让我的 8 个模块始终具有相同的高度,而不管标题或简介所需的行数如何?

我可以计算字符数并为标题和简介设置一些限制,但所需的行数会因我的字体字母的宽度而异......我希望除了字符数之外还有另一种解决方案......

我希望问题足够清楚! 提前谢谢你:)

【问题讨论】:

  • 我是唯一一个当我读到任何 的派生词时眼睛都呆滞的人吗?“我正在使用 X 框架来做 X . 我该如何做这个小改动?”
  • 您只需要发表此评论,不是吗?您可能是对的,但是对于某人而言,这可能是一个很大的变化,而对其他人来说只是一个很小的变化……如果您提供一些解决方案而不是批评我的要求,将不胜感激!没有难过的感觉,我意识到这可能不是这里最难的问题,但我只是想看看其他人如何解决这些问题。干杯:)
  • 没有批评,只是呆滞的眼睛。与许多不使用框架的人相比,框架生成的代码要好得多。这恰好是我在评论中表示无法提供帮助的一篇文章:)祝你好运!

标签: php html css joomla


【解决方案1】:

遍历这些模块,获取它们的高度,选择最大的一个并应用于所有模块。

var max = 0;

$('div.title').each(function(i,item){
   var height = $(item).height();
   if(height > max) {
      max = height;
   }
});

$('div.title').css('height', max + 'px');

【讨论】:

  • 谢谢,你的回答很好!这次我选择使用更简单的解决方案!
【解决方案2】:

这似乎是一个 CSS 问题(或者我误解了这个问题)。如果所有模块都属于“模块”类,那么您需要:

.module {height:200px; overflow:hidden;[more styles]}

【讨论】:

  • 是的,我可以这样做,我想以某种方式动态检测是否需要使标题较短的模块更高...
  • 如果您需要动态执行此操作,那么 JS/jquery 将是您的最佳选择。从 kdzwinel 的代码开始(假设您使用的是 jquery),它将根据最大值设置所有相同的大小。您是否也尝试重新组织模块的顺序?
  • 谢谢大家,我已经通过使用 css 将我的标题 div 设置为两行的高度(在我的示例中为 40px)并设置标题的字符限制来简化它。现在我的标题足够长了,但在添加新文章时还需要观看,以免弄乱布局。这应该没问题...谢谢你们,Ben D 和 kdzwinel...
猜你喜欢
  • 2018-03-02
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2018-09-16
  • 2018-01-29
相关资源
最近更新 更多